.elementor-6311 .elementor-element.elementor-element-c5f8334{--display:flex;--min-height:500px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:none;--border-style:none;}.elementor-6311 .elementor-element.elementor-element-c5f8334:not(.elementor-motion-effects-element-type-background), .elementor-6311 .elementor-element.elementor-element-c5f8334 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-6311 .elementor-element.elementor-element-d698327{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-d393599{--display:flex;--min-height:60vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:space-evenly;}.elementor-6311 .elementor-element.elementor-element-8e93f18.elementor-element{--align-self:center;}.elementor-6311 .elementor-element.elementor-element-8e93f18{text-align:center;}.elementor-6311 .elementor-element.elementor-element-8e93f18 .elementor-heading-title{font-size:50px;font-weight:900;}.elementor-6311 .elementor-element.elementor-element-055e963{text-align:center;}.elementor-6311 .elementor-element.elementor-element-055e963 .elementor-heading-title{font-size:35px;font-weight:300;}.elementor-6311 .elementor-element.elementor-element-bb7be5b .elementor-button{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:400;box-shadow:0px 4px 12px 0px rgba(0,0,0,0.5);}.elementor-6311 .elementor-element.elementor-element-0e92c7a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-97d898a{text-align:center;font-size:18px;}.elementor-6311 .elementor-element.elementor-element-3493edd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-7e43ffc{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-d1886ed{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-d1886ed:not(.elementor-motion-effects-element-type-background), .elementor-6311 .elementor-element.elementor-element-d1886ed > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-6311 .elementor-element.elementor-element-5d52883{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:20px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-71758d8{text-align:center;}.elementor-6311 .elementor-element.elementor-element-71758d8 .elementor-heading-title{font-size:40px;font-weight:900;color:var( --e-global-color-primary );}.elementor-6311 .elementor-element.elementor-element-1539e19{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-ba9fd03{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-29b8290{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-d2eb3b5{padding:0px 0px 0px 0px;}.elementor-6311 .elementor-element.elementor-element-d2eb3b5 img{width:120%;max-width:100%;height:500px;object-fit:contain;object-position:center center;}.elementor-6311 .elementor-element.elementor-element-69f1c42{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-d4d6d6d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-d4d6d6d:not(.elementor-motion-effects-element-type-background), .elementor-6311 .elementor-element.elementor-element-d4d6d6d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-9493398 );}.elementor-6311 .elementor-element.elementor-element-d4eacdb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-6311 .elementor-element.elementor-element-dde1dc5{--display:flex;--min-height:500px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-6311 .elementor-element.elementor-element-dde1dc5:not(.elementor-motion-effects-element-type-background), .elementor-6311 .elementor-element.elementor-element-dde1dc5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-6311 .elementor-element.elementor-element-9df8b89{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-6311 .elementor-element.elementor-element-0e11197{text-align:center;color:var( --e-global-color-9493398 );}.elementor-6311 .elementor-element.elementor-element-0e11197 a{color:var( --e-global-color-9493398 );}.elementor-6311 .elementor-element.elementor-element-0e11197 a:hover, .elementor-6311 .elementor-element.elementor-element-0e11197 a:focus{color:var( --e-global-color-9493398 );}.elementor-6311 .elementor-element.elementor-element-337835a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:space-evenly;}.elementor-6311 .elementor-element.elementor-element-9fd8b66{text-align:center;}.elementor-6311 .elementor-element.elementor-element-9fd8b66 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:50px;font-weight:900;color:var( --e-global-color-secondary );}.elementor-6311 .elementor-element.elementor-element-c4d9d7c{text-align:center;font-size:25px;font-weight:300;color:#FFFFFF;}.elementor-6311 .elementor-element.elementor-element-9228761 .elementor-button{font-family:"Roboto", Sans-serif;font-size:16px;box-shadow:0px 4px 12px 0px rgba(0,0,0,0.5);}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-6311 .elementor-element.elementor-element-c5f8334{--min-height:350px;}.elementor-6311 .elementor-element.elementor-element-8e93f18{text-align:center;}.elementor-6311 .elementor-element.elementor-element-8e93f18 .elementor-heading-title{font-size:35px;}.elementor-6311 .elementor-element.elementor-element-055e963{text-align:center;}.elementor-6311 .elementor-element.elementor-element-055e963 .elementor-heading-title{font-size:20px;}.elementor-6311 .elementor-element.elementor-element-97d898a{font-size:16px;}.elementor-6311 .elementor-element.elementor-element-71758d8{text-align:center;}.elementor-6311 .elementor-element.elementor-element-71758d8 .elementor-heading-title{font-size:35px;}.elementor-6311 .elementor-element.elementor-element-dde1dc5{--min-height:350px;}.elementor-6311 .elementor-element.elementor-element-9fd8b66 .elementor-heading-title{font-size:35px;}.elementor-6311 .elementor-element.elementor-element-c4d9d7c{font-size:20px;}}@media(max-width:767px){.elementor-6311 .elementor-element.elementor-element-8e93f18{text-align:center;}.elementor-6311 .elementor-element.elementor-element-8e93f18 .elementor-heading-title{font-size:35px;}.elementor-6311 .elementor-element.elementor-element-055e963{text-align:center;}.elementor-6311 .elementor-element.elementor-element-055e963 .elementor-heading-title{font-size:20px;}.elementor-6311 .elementor-element.elementor-element-bb7be5b .elementor-button{font-size:16px;}.elementor-6311 .elementor-element.elementor-element-97d898a{font-size:15px;}.elementor-6311 .elementor-element.elementor-element-1539e19{--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;}.elementor-6311 .elementor-element.elementor-element-ba9fd03{--flex-direction:column-reverse;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-29b8290{--flex-direction:column-reverse;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-6311 .elementor-element.elementor-element-d2eb3b5 img{height:203px;object-position:top center;}.elementor-6311 .elementor-element.elementor-element-5c676b0{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-6311 .elementor-element.elementor-element-9fd8b66 .elementor-heading-title{font-size:35px;}.elementor-6311 .elementor-element.elementor-element-c4d9d7c{font-size:15px;}.elementor-6311 .elementor-element.elementor-element-9228761 .elementor-button{font-size:16px;}}@media(min-width:768px){.elementor-6311 .elementor-element.elementor-element-d698327{--width:50%;}.elementor-6311 .elementor-element.elementor-element-d393599{--width:50%;}.elementor-6311 .elementor-element.elementor-element-ba9fd03{--width:50%;}.elementor-6311 .elementor-element.elementor-element-29b8290{--width:50%;}.elementor-6311 .elementor-element.elementor-element-9df8b89{--width:50%;}.elementor-6311 .elementor-element.elementor-element-337835a{--width:50%;}}/* Start custom CSS for html, class: .elementor-element-3dd21ae *//* --- STRATEGY ARROW SWEEP DIVIDER --- */
.sf-divider-strategy {
  position: relative;
  height: 3px;
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
  margin: 40px 0;
  background: linear-gradient(
    90deg,
    rgba(8,65,119,.15),
    rgba(8,65,119,.25),
    rgba(8,65,119,.15)
  );
}

.sf-divider-strategy::after {
  content: "▶";
  position: absolute;
  left: -40px;
  top: -9px;
  width: auto;
  font-size: 18px;
  color: #72C89E;
  text-shadow: 0 0 10px rgba(114,200,158,.6);
  animation: strategy-arrow 3.2s linear infinite;
}

@keyframes strategy-arrow {
  from { transform: translateX(0); opacity: .5; }
  to   { transform: translateX(calc(100vw + 80px)); opacity: 1; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-807e01d *//* ======================================================
   IT Strategy & Advisory – What We Do
   Blue-first theme | Clean card layout | Accent bars
   ====================================================== */

.sf-it-whatwedo {
  --green: #72C89E;    
  --blue: #084177;
  --blue-2: #2C79AD;
  --glow: #72C89E;
  --text: #0E1F1C;
  --muted: #41524F;
  --soft-blue: #F2F7FA;

  max-width: 900px;
  margin: 50px auto;
  padding: 0 16px;
}

/* Section Title */
.sf-it-whatwedo .sf-title {
  font-weight: 800;
  color: var(--blue);
  margin-bottom: 18px;
  text-align: center;
}

/* Intro Paragraphs */
.sf-it-whatwedo .sf-intro {
  text-align: center;
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.6;
  max-width: 780px;
  margin: 0 auto 14px;
}

/* Card Row */
.sf-it-row {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  margin-top: 32px;
}

/* Individual Card */
.sf-it-card {
  position: relative;
  background: var(--soft-blue);
  border: 1px solid rgba(8,65,119,.14);
  border-radius: 14px;
  padding: 22px 22px 26px;
  box-shadow: 0 8px 18px rgba(0,0,0,.05);
  transition: transform .25s ease, box-shadow .25s ease;

  /* fade-up animation */
  opacity: 0;
  transform: translateY(16px);
  animation: it-card-in .6s forwards ease;
}

/* stagger */
.sf-it-card:nth-child(1){ animation-delay: .05s; }
.sf-it-card:nth-child(2){ animation-delay: .15s; }
.sf-it-card:nth-child(3){ animation-delay: .25s; }

@keyframes it-card-in {
  to { opacity: 1; transform: none; }
}

/* Accent bar */
.sf-it-accent {
  position: absolute;
  top: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, var(--green), var(--glow));
  border-radius: 3px;

  animation: it-accent-sweep 1.3s forwards cubic-bezier(.16,.84,.44,1);
}

@keyframes it-accent-sweep {
  to { width: 100%; }
}

/* Heading + text inside card */
.sf-it-card h3 {
  margin: 14px 0 6px;
  font-weight: 700;
  color: var(--blue);
  text-align: center;
}

.sf-it-card p {
  margin: 0;
  color: var(--muted);
  text-align: center;
}

/* Hover effect */
.sf-it-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 12px 24px rgba(0,0,0,.1),
    0 0 12px rgba(114,200,158,.25);
}

/* Mobile */
@media(max-width: 480px){
  .sf-it-card { padding: 20px 18px; }
}
/* ======================================================
   SECTION — IT Strategy & Advisory (TYPOGRAPHY UPGRADE)
   Headings: Montserrat (40→20 desktop, 25→15 mobile)
   Body: Roboto (18 desktop, 15 mobile)
   ====================================================== */

/* -----------------------------
   GLOBAL BODY TEXT (Roboto)
   ----------------------------- */
.sf-it-whatwedo,
.sf-it-whatwedo p,
.sf-it-whatwedo li {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: var(--muted);
}

@media (max-width: 520px){
  .sf-it-whatwedo,
  .sf-it-whatwedo p,
  .sf-it-whatwedo li {
    font-size: 15px;
  }
}

/* -----------------------------
   MAIN HEADING (H2)
   ----------------------------- */
.sf-it-whatwedo .sf-title {
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  text-align: center;                    /* required */
  color: var(--blue);
  margin-bottom: 18px;

  /* Desktop 40 → 20 */
  font-size: clamp(35px, 3vw, 35px);
}

@media (max-width: 520px){
  .sf-it-whatwedo .sf-title {
    /* Mobile 25 → 15 */
    font-size: clamp(35px, 6vw, 35px);
  }
}

/* -----------------------------
   INTRO PARAGRAPHS
   ----------------------------- */
.sf-it-whatwedo .sf-intro {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  text-align: center;
  color: var(--muted);
  max-width: 780px;
  margin: 0 auto 14px;
}

@media (max-width: 520px){
  .sf-it-whatwedo .sf-intro {
    font-size: 15px;
  }
}

/* -----------------------------
   CARD HEADINGS (H3)
   ----------------------------- */
.sf-it-card h3 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: var(--blue);
  text-align: center;

  /* Heading band for H3 */
  font-size: clamp(16px, 2.6vw, 16px);
  margin: 14px 0 6px;
}

@media (max-width: 520px){
  .sf-it-card h3 {
    font-size: clamp(15px, 5vw, 15px);
  }
}

/* -----------------------------
   CARD BODY TEXT
   ----------------------------- */
.sf-it-card p {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  text-align: center;
  color: var(--muted);
}

@media (max-width: 520px){
  .sf-it-card p {
    font-size: 15px;
  }
}
``/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-33f23c1 *//* ======================================================
   IT Strategy & Advisory – Key Features
   Blue-first theme | Accent sweep | Stagger animation
   ====================================================== */

.sf-it-features {
  --green: #72C89E;
  --blue: #084177;
  --blue-2: #2C79AD;
  --glow: #72C89E;
  --soft-blue: #F2F7FA;
  --text: #0E1F1C;
  --muted: #41524F;

  max-width: 1100px;
  margin: 50px auto;
  padding: 0 16px;
}

/* Section Title */
.sf-it-features .sf-title {
  font-weight: 900;
  text-align: center;
  color: var(--blue);
  margin-bottom: 26px;
}

/* GRID */
.sf-feat-grid {
  display: grid;
  gap: 26px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* CARD */
.sf-feat-card {
  position: relative;
  background: var(--soft-blue);
  border: 1px solid rgba(8,65,119,.14);
  border-radius: 16px;
  padding: 28px 24px 30px;
  text-align: center;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);

  opacity: 0;
  transform: translateY(16px);
  animation: feat-in .6s forwards ease;
}

/* Stagger entry */
.sf-feat-card:nth-child(1){ animation-delay: .05s; }
.sf-feat-card:nth-child(2){ animation-delay: .15s; }
.sf-feat-card:nth-child(3){ animation-delay: .25s; }
.sf-feat-card:nth-child(4){ animation-delay: .35s; }
.sf-feat-card:nth-child(5){ animation-delay: .45s; }

@keyframes feat-in {
  to { opacity: 1; transform: none; }
}

}

@keyframes feat-accent {
  to { width: 100%; }
}

/* Icons */
.sf-feat-icon {
  font-size: 30px;
  display: block;
  margin-bottom: 14px;
  color: var(--blue);
  text-shadow: 0 0 10px rgba(114,200,158,.25);
}

/* Text */
.sf-feat-card h3 {
  margin: 0 0 8px;
  font-weight: 700;
  color: var(--blue);
}

.sf-feat-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

/* Hover */
.sf-feat-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 12px 24px rgba(0,0,0,.1),
    0 0 14px rgba(114,200,158,.32);
}

/* MOBILE */
@media(max-width: 480px){
  .sf-feat-card {
    padding: 14px 14px;
  }
  .sf-feat-icon {
    font-size: 32px;
  }
}
/* ----------------------------------------
   FIX CARD WIDTH & GRID BALANCE
---------------------------------------- */
.sf-feat-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); /* narrower cards */
  gap: 20px;
  max-width: 1000px;
  margin: 0 auto;
}

/* ----------------------------------------
   FIX SPACING ABOVE + BELOW TITLE
---------------------------------------- */
.sf-it-features .sf-title {
  margin-bottom: 16px;     /* reduces the awkward gap */
  font-size: 1.8rem;
}

/* ----------------------------------------
   IMPROVE CARD BALANCE
---------------------------------------- */
.sf-feat-card {
  padding: 22px 18px 26px;  /* reduce empty space */
  min-height: 220px;        /* consistent height */
}

/* ----------------------------------------
   ICON VISUAL IMPROVEMENTS
---------------------------------------- */
.sf-feat-icon {
  font-size: 30px;          /* slightly smaller */
  margin-bottom: 10px;
  transform: translateY(-2px);
}

/* ----------------------------------------
   TEXT ALIGNMENT + READABILITY
---------------------------------------- */
.sf-feat-card h3 {
  font-size: 1.1rem;
  line-height: 1.35;
}

.sf-feat-card p {
  font-size: .98rem;
}

/* ----------------------------------------
   KEEP CARDS VISUALLY GROUPED
---------------------------------------- */
.sf-it-features {
  padding-top: 20px;
  padding-bottom: 20px;
}
.sf-feat-card {
  border-top: 3px solid #2C79AD22;
}
/* =========================================
   FORCE 5 CARDS IN ONE ROW ON DESKTOP
   (keeps the blue‑first card look)
   ========================================= */

/* 1) Allow a wider container so 5 cards breathe */
.sf-it-features {
  max-width: 1200px;       /* was 1100px; increase if needed to 1240/1280 */
  margin: 50px auto;
}

/* 2) Grid: exactly 5 columns on wide viewports */
@media (min-width: 1200px){
  .sf-feat-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 18px;             /* slightly tighter gap */
  }
}

/* 3) Card sizing tweaks so they fit comfortably */
@media (min-width: 1200px){
  .sf-feat-card {
    padding: 20px 16px 22px;     /* reduce padding */
    min-height: 210px;           /* consistent, compact height */
  }
  .sf-feat-icon {
    font-size: 28px;             /* slightly smaller icon */
    margin-bottom: 10px;
  }
  .sf-feat-card h3 {
    font-size: 1.02rem;          /* tighten heading to avoid wrapping */
    line-height: 1.3;
  }
  .sf-feat-card p {
    font-size: .95rem;           /* a touch smaller body text */
    line-height: 1.5;
  }
}

/* 4) Ensure clean wrap at narrower widths (4/3/2/1 auto-fit) */
@media (max-width: 1199px){
  .sf-feat-grid {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 22px;                   /* restore a bit more breathing room */
  }
}

/* 5) Optional: prevent single long words from breaking layout */
.sf-feat-card h3, .sf-feat-card p {
  word-break: normal;
  overflow-wrap: anywhere;
}
/* ======================================================
   SECTION – IT Strategy & Advisory Key Features
   TYPOGRAPHY + PALETTE UPDATE (ONLY)
   ====================================================== */

/* Section background MUST be #084177 */
.sf-it-features {
  background: #084177;
  padding: 50px 16px;
  border-radius: 0; /* unchanged visually */
}

/* -----------------------------------------
   GLOBAL BODY TEXT (Roboto)
   ----------------------------------------- */
.sf-it-features,
.sf-it-features p,
.sf-it-features li {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: #ffffff;  /* readable on blue background */
}

@media (max-width: 520px){
  .sf-it-features,
  .sf-it-features p,
  .sf-it-features li {
    font-size: 15px;
  }
}

/* -----------------------------------------
   MAIN HEADING (H2) — Montserrat
   ----------------------------------------- */
.sf-it-features .sf-title {
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  text-align: center;
  color: #ffffff;
  margin-bottom: 26px;

  /* Desktop 40→20, mobile 25→15 */
  font-size: clamp(40px, 3vw, 40px);
}

@media (max-width: 520px){
  .sf-it-features .sf-title {
    font-size: clamp(35px, 6vw, 35px);
  }
}

/* -----------------------------------------
   GRID — keep original spacing/layout
   ----------------------------------------- */
.sf-feat-grid {
  display: grid;
  gap: 26px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  max-width: 1100px;
  margin: 0 auto;
}

/* -----------------------------------------
   CARD STYLES (keep original look)
   ----------------------------------------- */
.sf-feat-card {
  position: relative;
  background: #ffffff; /* allowed color instead of soft-blue */
  border: 1px solid #72c89e;
  border-radius: 16px;
  padding: 28px 24px 30px;
  text-align: center;
  box-shadow: 0 8px 18px rgba(255,255,255,.15); /* subtle white glow on blue */
  transform: translateY(16px);
  opacity: 0;
  animation: feat-in .6s forwards ease;
}

/* -----------------------------------------
   ACCENT SWEEP BAR — adjust to allowed colors
   ----------------------------------------- */
.sf-feat-accent {
  position: absolute;
  top: 0; left: 0;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, #084177, #72c89e);
  animation: feat-accent 1.3s forwards cubic-bezier(.16,.84,.44,1);
}

/* -----------------------------------------
   ICONS (keep look but update palette)
   ----------------------------------------- */
.sf-feat-icon {
  font-size: 36px;
  margin-bottom: 14px;
  color: #084177;  /* allowed */
  text-shadow: 0 0 10px rgba(114,200,158,.25);
}

/* -----------------------------------------
   CARD HEADINGS (H3) — Montserrat
   ----------------------------------------- */
.sf-feat-card h3 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  margin: 0 0 8px;
  color: #084177;

  /* Within 40→20 desktop band, smaller range for card H3 */
  font-size: clamp(16px, 2.8vw, 16px);
}

@media (max-width: 520px){
  .sf-feat-card h3 {
    font-size: clamp(15px, 5vw, 15px);
  }
}

/* -----------------------------------------
   CARD BODY TEXT — Roboto
   ----------------------------------------- */
.sf-feat-card p {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  color: #084177;
  line-height: 1.55;
}

@media (max-width: 520px){
  .sf-feat-card p {
    font-size: 15px;
  }
}

/* -----------------------------------------
   HOVER EFFECT — unchanged
   ----------------------------------------- */
.sf-feat-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 12px 24px rgba(255,255,255,.18),
    0 0 14px rgba(114,200,158,.32);
}
/* ======================================================
   IT Strategy & Advisory – Key Features (FORCE 5 IN A ROW)
   Palette- & type-safe overrides + desktop no-wrap
   ====================================================== */

/* Section background + base body text */
.sf-it-features {
  background: #084177;                    /* required background */
  padding: 0px 16px;
}

/* Body text (Roboto) */
.sf-it-features,
.sf-it-features p,
.sf-it-features li {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: #ffffff;                          /* white on blue */
}
@media (max-width: 520px){
  .sf-it-features,
  .sf-it-features p,
  .sf-it-features li { font-size: 15px; }
}

/* Main heading (Montserrat, centered) */
.sf-it-features .sf-title {
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  text-align: center;
  color: #72C89E;
  margin-bottom: 26px;
  font-size: clamp(40px, 3vw, 40px);      /* desktop 40→20 */
}
@media (max-width: 520px){
  .sf-it-features .sf-title { font-size: clamp(35px, 6vw, 35px); } /* mobile 25→15 */
}

/* Card grid — EXACTLY 5 across on desktop */
.sf-feat-grid {
  display: grid;
  gap: 10px;
  max-width: 1600px;                       /* give grid room to fit 5 */
  margin: 0 auto;
}
@media (min-width: 1200px){
  .sf-feat-grid { grid-template-columns: repeat(5, 1fr); }  /* lock to 5 */
}

/* Card visuals (keep look, adjust for palette) */
.sf-feat-card {
  position: relative;
  background: #ffffff;                     /* white card on blue bg */
  border: 1px solid #72c89e;               /* subtle green keyline */
  border-radius: 16px;
  padding: 22px 18px 20px;                 /* compact to avoid wrapping */
  text-align: left;
  box-shadow: 0 8px 18px rgba(255,255,255,.15);
  min-height: 210px;                       /* consistent height */
  opacity: 0;
  transform: translateY(16px);
  animation: feat-in .6s forwards ease;
}

/* Icon colour within palette */
.sf-feat-icon {
  color: #084177;
  text-align: center;
  font-size: 32px;
  margin-bottom: 10px;
  text-shadow: 0 0 10px rgba(114,200,158,.25);
}

/* Card heading (Montserrat) */
.sf-feat-card h3 {
  font-family: "Montserrat", sans-serif;
  text-align: center;
  font-weight: 700;
  color: #084177;
  margin: 0 0 6px;
  font-size: clamp(16px, 2.4vw, 16px);
  line-height: 1.3;
}
/* Card body (Roboto) */
.sf-feat-card p {
  font-family: "Roboto", sans-serif;
 place-items: center;
  text-align: center;
  font-size: 16px;
  line-height: 1.55;
  color: #084177;
}
@media (max-width: 520px){
  .sf-feat-card h3 { font-size: clamp(15px, 5vw, 15px); }
  .sf-feat-card p  { font-size: 15px; }
}

/* Accent sweep bar — palette safe */
.sf-feat-accent {
  background: linear-gradient(90deg, #084177, #72c89e) !important;
}

/* HOVER (unchanged look, tuned for blue bg) */
.sf-feat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(255,255,255,.18), 0 0 14px rgba(114,200,158,.32);
}

/* ---------------- Desktop anti-wrap helpers ---------------- */
/* Prevent long headings from forcing a wrap to a second row */
@media (min-width: 1200px){
  .sf-feat-card h3, .sf-feat-card p {
    overflow-wrap: anywhere;               /* allow soft-wrap within card */
    word-break: normal;
  }
}

/* ---------------- Tablet & Mobile behaviour ---------------- */
/* Below 1200px, let the grid auto-fit (4/3/2/1) for responsiveness */
@media (max-width: 1199px){
  .sf-feat-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 22px; }
}

/* Small mobile padding/icon size tweak (kept from your setup) */
@media (max-width: 480px){
  .sf-feat-card { padding: 20px 16px; }
  .sf-feat-icon { font-size: 28px; }
}
/* Vertically center icon + text inside each card */
.sf-feat-card {
  display: flex;
  flex-direction: column;     /* stack icon, heading, paragraph vertically */
  justify-content: center;    /* center vertically */
  align-items: center;        /* center horizontally */
  text-align: center;         /* keep your centered layout */
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f5d0b58 *//* ======================================================
   IT Strategy & Advisory – Why IT Strategy Matters
   Palette-safe, no gradients, Montserrat/Roboto sizing
   ====================================================== */

.sf-it-matters {
  --black #000000;
  --blue: #084177;
  --green: #72c89e;
  --white: #ffffff;
  --soft: #f2f7fa;

  max-width: 900px;
  margin: 50px auto;
  padding: 0 16px;
  background: var(--white);              /* background must be #ffffff */
}

/* -----------------------------
   TYPOGRAPHY BASICS
   ----------------------------- */

/* Body text defaults (Roboto) */
.sf-it-matters,
.sf-it-matters p,
.sf-it-matters li {
  font-family: "Roboto", sans-serif;
  font-size: 16px;                       /* desktop body */
  line-height: 1.6;
  color: var(--blue);
}

/* Mobile body size */
@media (max-width: 520px){
  .sf-it-matters,
  .sf-it-matters p,
  .sf-it-matters li {
    font-size: 15px;                     /* mobile body */
  }
}

/* Future-proof: any headings you add (H3/H4/H5) follow Montserrat sizing */
.sf-it-matters h3,
.sf-it-matters h4,
.sf-it-matters h5 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  text-align: center;                    /* center headings if added later */
  color: var(--blue);
  font-size: clamp(16px, 3vw, 32px);     /* desktop within 40–20 band */
  margin: 0 0 14px;
}
@media (max-width: 520px){
  .sf-it-matters h3,
  .sf-it-matters h4,
  .sf-it-matters h5 {
    font-size: clamp(15px, 5.5vw, 25px); /* mobile within 25–15 band */
  }
}

/* -----------------------------
   INTRO & OUTRO (body copy)
   ----------------------------- */

.sf-itm-intro,
.sf-itm-outro {
  text-align: center;
  color: var(--blue);
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}
.sf-itm-intro { margin: 0 auto 28px; }
.sf-itm-outro { margin-top: 28px; }

/* -----------------------------
   LIST LAYOUT
   ----------------------------- */

.sf-itm-list {
  display: grid;
  gap: 18px;
}

/* Individual list row (keep existing look & animation) */
.sf-itm-item {
  position: relative;
  background: var(--soft);               /* #f2f7fa */
  border: 1px solid rgba(8,65,119,.12);  /* within palette via alpha */
  border-radius: 12px;
  padding: 16px 20px 16px 18px;

  display: flex;
  align-items: center;
  gap: 14px;

  box-shadow: 0 6px 14px rgba(0,0,0,.06);

  opacity: 0;
  transform: translateY(14px);
  animation: itm-in .6s forwards ease;
}

/* Stagger animation */
.sf-itm-item:nth-child(1){ animation-delay: .05s; }
.sf-itm-item:nth-child(2){ animation-delay: .15s; }
.sf-itm-item:nth-child(3){ animation-delay: .25s; }
.sf-itm-item:nth-child(4){ animation-delay: .35s; }
.sf-itm-item:nth-child(5){ animation-delay: .45s; }

@keyframes itm-in { to { opacity: 1; transform: none; } }

/* Left accent bar — NO gradients, solid green only */
.sf-itm-accent {
  width: 4px;
  height: 100%;
  border-radius: 4px;
  background: var(--green);              /* #72c89e (solid) */
  box-shadow: 0 0 10px rgba(114,200,158,.35);
}

/* List text (keep bold look, but follows Roboto sizes above) */
.sf-itm-item p {
  margin: 0;
  color: var(--blue);
  font-weight: 700;
}

/* Mobile padding tweak */
@media (max-width: 480px){
  .sf-itm-item { padding: 14px 16px; }
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-d2eb3b5 */.elementor-6311 .elementor-element.elementor-element-d2eb3b5 {
  display: flex;
  flex-direction: column;
  justify-content: center;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-29b8290 */.elementor-6311 .elementor-element.elementor-element-29b8290 {
  display: flex;
  justify-content: center;
  align-items: center;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-537dded *//* ======================================================
   IT Strategy & Advisory – Process Section
   Blue-first theme | Animated accent line | Stagger fade
   ====================================================== */

.sf-it-process {
  --blue: #084177;
  --blue-2: #2C79AD;
  --glow: #72C89E;
  --soft-blue: #F2F7FA;
  --text: #0E1F1C;
  --muted: #41524F;

  max-width: 900px;
  margin: 50px auto;
  padding: 14px 14px;
}

.sf-it-process .sf-title {
  color: var(--blue);
  font-weight: 800;
  text-align: center;
  margin-bottom: 26px;
}

/* PROCESS LIST */
.sf-process-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 22px;
}

/* INDIVIDUAL STEP */
.sf-process-step {
  position: relative;
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 18px;

  padding: 22px 22px;
  background: var(--soft-blue);
  border-radius: 16px;
  border: 1px solid rgba(8,65,119,.14);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);

  opacity: 0;
  transform: translateY(18px);
  animation: stepIn .7s forwards ease;
}

/* stagger */
.sf-process-step:nth-child(1){ animation-delay: .05s; }
.sf-process-step:nth-child(2){ animation-delay: .15s; }
.sf-process-step:nth-child(3){ animation-delay: .25s; }
.sf-process-step:nth-child(4){ animation-delay: .35s; }
.sf-process-step:nth-child(5){ animation-delay: .45s; }

@keyframes stepIn {
  to { opacity: 1; transform: none; }
}

/* NUMBER ICON */
.sf-step-icon {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--blue-2));
  color: #fff;
  font-weight: 800;
  font-size: 16px;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 4px 10px rgba(114,200,158,.25);
}

/* TEXT AREA */
.sf-step-content h3 {
  margin: 0 0 6px;
  color: var(--blue);
  font-weight: 700;
}

.sf-step-content p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

/* ACCENT BAR */
.sf-process-line {
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 0%;
  background: linear-gradient(var(--blue-2), var(--glow));
  box-shadow: 0 0 10px rgba(114,200,158,.35);
  border-radius: 2px;

  animation: lineSweep 1.3s forwards cubic-bezier(.16,.84,.44,1);
  animation-delay: inherit;
}

@keyframes lineSweep {
  to { height: 100%; }
}

/* HOVER */
.sf-process-step:hover {
  transform: translateY(-4px);
  box-shadow:
    0 12px 26px rgba(0,0,0,.1),
    0 0 12px rgba(114,200,158,.35);
}

/* MOBILE */
@media (max-width: 600px){
  .sf-process-step {
    grid-template-columns: 42px 1fr;
    padding: 20px 18px;
  }
  .sf-step-icon {
    width: 38px;
    height: 38px;
    font-size: 16px;
  }
}
/* ======================================================
   IT Strategy & Advisory – PROCESS SECTION (UPDATED)
   Typography + Accent Line (Solid Green)
   ====================================================== */

/* -----------------------------------------
   GLOBAL BODY TEXT — Roboto
   ----------------------------------------- */
.sf-it-process,
.sf-it-process p,
.sf-it-process li {
  font-family: "Roboto", sans-serif;
  font-size: 16px;               /* Desktop */
  line-height: 1.55;
  color: #084177;
}

@media (max-width: 520px){
  .sf-it-process,
  .sf-it-process p,
  .sf-it-process li {
    font-size: 15px;             /* Mobile */
  }
}

/* -----------------------------------------
   MAIN TITLE (H2) — Montserrat
   ----------------------------------------- */
.sf-it-process .sf-title {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  text-align: center;
  color: #084177;
  margin-bottom: 26px;

  /* Desktop: 40 → 20 */
  font-size: clamp(40px, 3vw, 40px);
}

@media (max-width: 520px){
  .sf-it-process .sf-title {
    /* Mobile: 25 → 15 */
    font-size: clamp(35px, 6vw, 35px);
  }
}

/* -----------------------------------------
   STEP HEADING (H3) — Montserrat
   ----------------------------------------- */
.sf-step-content h3 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: #084177;
  margin: 0 0 6px;

  /* Secondary headings within 40→20 desktop band */
  font-size: clamp(16px, 2.8vw, 16px);
}

@media (max-width: 520px){
  .sf-step-content h3 {
    font-size: clamp(15px, 5vw, 15px);
  }
}

/* -----------------------------------------
   STEP BODY (Roboto)
   ----------------------------------------- */
.sf-step-content p {
  font-family: "Roboto", sans-serif;
  font-size: 16px;              /* Desktop */
  color: #41524F;
  line-height: 1.55;
}

@media (max-width: 520px){
  .sf-step-content p {
    font-size: 15px;            /* Mobile */
  }
}

/* -----------------------------------------
   ACCENT LINE — SOLID GREEN (#72c89e)
   (Circle gradient STAYS as-is)
   ----------------------------------------- */
.sf-process-line {
  background: #72c89e !important;      /* REMOVE gradient */
  box-shadow: 0 0 10px rgba(114,200,158,.35);
}

/* Clean up any inline gradient overrides */
.sf-it-process [style*="linear-gradient"] {
  background-image: none !important;
  background-color: #72c89e !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5c676b0 *//* ======================================================
   IT Strategy & Advisory – Benefits Section
   Blue-first theme | Soft cards | Stagger fade animation
   ====================================================== */

.sf-it-benefits {
  --blue: #084177;
  --blue-2: #2C79AD;
  --glow: #72C89E;
  --text: #0E1F1C;
  --muted: #41524F;
  --soft-blue: #F2F7FA;

  max-width: 900px;
  margin: 50px auto 40px;
  padding: 14px 14px;
}

/* Section Title */
.sf-it-benefits .sf-title {
  font-weight: 900;
  text-align: center;
  color: var(--blue);
  margin-bottom: 26px;
}

/* Grid */
.sf-bene-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr;
}

/* Benefit Card */
.sf-bene-item {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 16px;
  align-items: center;

  padding: 18px 20px;
  background: var(--soft-blue);
  border: 1px solid rgba(8,65,119,.14);
  border-radius: 14px;
  box-shadow: 0 8px 16px rgba(0,0,0,.06);

  opacity: 0;
  transform: translateY(16px);
  animation: beneIn .6s forwards ease;
}

/* Stagger */
.sf-bene-item:nth-child(1){ animation-delay: .05s; }
.sf-bene-item:nth-child(2){ animation-delay: .15s; }
.sf-bene-item:nth-child(3){ animation-delay: .25s; }
.sf-bene-item:nth-child(4){ animation-delay: .35s; }
.sf-bene-item:nth-child(5){ animation-delay: .45s; }

@keyframes beneIn {
  to { opacity: 1; transform: none; }
}

/* Icon */
.sf-bene-icon {
  font-size: 34px;
  color: var(--blue);
  text-shadow: 0 0 10px rgba(114,200,158,.25);
}

/* Heading & text */
.sf-bene-item h3 {
  margin: 0 0 4px;
  font-weight: 700;
  color: var(--blue);
}

.sf-bene-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

/* Hover lift (optional, matches other pages) */
.sf-bene-item:hover {
  transform: translateY(-4px);
  box-shadow:
    0 12px 20px rgba(0,0,0,.1),
    0 0 12px rgba(114,200,158,.35);
}

/* Responsive */
@media (max-width: 480px){
  .sf-bene-item {
    padding: 14px;
    grid-template-columns: 42px 1fr;
  }
  .sf-bene-icon { font-size: 30px; }
}
/* ======================================================
   IT Strategy & Advisory – Benefits (Typography + Palette)
   Required colours: #084177 #72c89e #ffffff
   Background: #084177; Keep layout/animation the same
   ====================================================== */

/* Section wrapper: blue background */
.sf-it-benefits {
  background: #084177;
  padding: 14px 14px 40px;
  border-radius: 0; /* visual parity */
}

/* -----------------------------
   BASE BODY (Roboto)
   ----------------------------- */
.sf-it-benefits,
.sf-it-benefits p,
.sf-it-benefits li {
  font-family: "Roboto", sans-serif;
  font-size: 18px;         /* desktop body */
  line-height: 1.55;
  color: #ffffff;          /* readable on blue background */
}

@media (max-width: 520px){
  .sf-it-benefits,
  .sf-it-benefits p,
  .sf-it-benefits li {
    font-size: 15px;       /* mobile body */
  }
}

/* -----------------------------
   MAIN HEADING (H2) — Montserrat
   Centered + responsive (40→20 desktop, 25→15 mobile)
   ----------------------------- */
.sf-it-benefits .sf-title {
  font-family: "Montserrat", sans-serif;
  font-weight: 900;
  text-align: center;
  color: #72c89e;
  margin-bottom: 26px;
  font-size: clamp(35px, 3vw, 40px);
}

@media (max-width: 520px){
  .sf-it-benefits .sf-title {
    font-size: clamp(35px, 6vw, 35px);
  }
}

/* -----------------------------
   GRID (unchanged layout intent)
   ----------------------------- */
.sf-bene-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr;  /* as in your original */
  max-width: 900px;
  margin: 0 auto;
}

/* -----------------------------
   CARD — keep feel, palette-safe
   ----------------------------- */
.sf-bene-item {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 16px;
  align-items: center;

  padding: 18px 20px;
  background: #ffffff;          /* was soft-blue → white */
  border: 1px solid #72c89e;    /* subtle green keyline */
  border-radius: 14px;
  box-shadow: 0 8px 16px rgba(255,255,255,.16); /* soft lift on blue bg */

  opacity: 0;
  transform: translateY(16px);
  animation: beneIn .6s forwards ease;
}

/* keep your stagger timings */
.sf-bene-item:nth-child(1){ animation-delay: .05s; }
.sf-bene-item:nth-child(2){ animation-delay: .15s; }
.sf-bene-item:nth-child(3){ animation-delay: .25s; }
.sf-bene-item:nth-child(4){ animation-delay: .35s; }
.sf-bene-item:nth-child(5){ animation-delay: .45s; }

@keyframes beneIn { to { opacity: 1; transform: none; } }

/* Icon on white card → brand blue */
.sf-bene-icon {
  font-size: 34px;
  color: #084177;
  text-shadow: 0 0 10px rgba(114,200,158,.25); /* green glow is allowed */
}

/* -----------------------------
   CARD HEADINGS & TEXT
   ----------------------------- */
/* H3 in cards = Montserrat, within heading band (below H2) */
.sf-bene-item h3 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: #084177;
  margin: 0 0 4px;
  font-size: clamp(18px, 2.6vw, 18px);
}

@media (max-width: 520px){
  .sf-bene-item h3 { font-size: clamp(15px, 5vw, 15px); }
}

/* Body text on the card (Roboto) */
.sf-bene-item p {
  font-family: "Roboto", sans-serif;
  margin: 0;
  color: #084177;     /* legible on white; stays in palette */
  line-height: 1.55;
  font-size: 16px;    /* explicit for card body */
}

@media (max-width: 520px){
  .sf-bene-item p { font-size: 15px; }
}

/* Hover lift — tuned for blue background (same feel) */
.sf-bene-item:hover {
  transform: translateY(-4px);
  box-shadow:
    0 12px 20px rgba(255,255,255,.18),
    0 0 12px rgba(114,200,158,.35);
}

/* Responsive touch-up */
@media (max-width: 480px){
  .sf-bene-item {
    padding: 14px;
    grid-template-columns: 42px 1fr;
  }
  .sf-bene-icon { font-size: 30px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-2780c4d *//* ======================================================
   SECTION 4 – IT Strategy & Advisory FAQ (Blue-first)
   Clean accordion | glowing icons | soft-blue cards
   ====================================================== */

.sf-sec4 {
  --blue: #084177;
  --blue-2: #2C79AD;
  --glow: #72C89E;
  --text: #0E1F1C;
  --muted: #41524F;
  --soft-blue: #F2F7FA;
  --green: #72C89E;

  max-width: 900px;
  margin: 50px auto;
  padding: 14px 14px;
  color: var(--text);
}

/* Title */
.sf-faq-title {
  color: var(--blue);
  font-weight: 900;
  margin: 0 0 24px 0;
  text-align: center;
}

/* FAQ container */
.sf-faq {
  display: grid;
  gap: 16px;
}

/* FAQ card */
.sf-faq-item {
  background: var(--soft-blue);
  border-radius: 14px;
  border: 1px solid rgba(8,65,119,.14);
  box-shadow: 0 6px 14px rgba(0,0,0,.06);
  overflow: hidden;
  transition: box-shadow .25s ease, border-color .25s ease;
}

.sf-faq-item:hover {
  box-shadow:
    0 12px 26px rgba(0,0,0,.10),
    0 0 12px rgba(114,200,158,.35);
  border-color: rgba(8,65,119,.22);
}

/* FAQ header */
.sf-faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 18px 18px 58px;
  font-weight: 900;
  color: var(--blue);
  display: flex;
  align-items: center;
  position: relative;
}

/* Remove default arrow */
.sf-faq-item summary::-webkit-details-marker { display: none; }

/* Icon bubble */
.sf-faq-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--green), var(--green));
  color: #fff;
  position: absolute;
  left: 14px;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 10px rgba(114,200,158,.25);
}

/* Arrow on the right */
.sf-faq-item summary::after {
  content: "▾";
  font-size: 16px;
  color: var(--blue-2);
  right: 20px;
  position: absolute;
  transition: transform .25s ease;
}

.sf-faq-item[open] summary::after {
  transform: rotate(180deg);
}

/* FAQ content */
.sf-faq-content {
  padding: 0 18px 16px 58px;
}

.sf-faq-content p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

/* MOBILE */
@media (max-width: 480px) {
  .sf-faq-item summary {
    padding: 16px 16px 16px 52px;
  }
  .sf-faq-icon {
    width: 30px;
    height: 30px;
    font-size: 15px;
    left: 12px;
  }
  .sf-faq-content {
    padding: 0 16px 14px 52px;
  }
}
/* ======================================================
   IT Strategy & Advisory FAQ — TYPOGRAPHY + PALETTE UPDATE
   Headings: Montserrat (40→20 desktop / 25→15 mobile)
   Body: Roboto (18 desktop / 15 mobile)
   Allowed colors: #084177, #72c89e, #ffffff
   Layout + animations remain unchanged
   ====================================================== */

/* -----------------------------
   BASE BODY TEXT (Roboto)
   ----------------------------- */
.sf-sec4,
.sf-sec4 p,
.sf-sec4 li {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  line-height: 1.55;
  color: #084177;
}

@media (max-width: 520px){
  .sf-sec4,
  .sf-sec4 p,
  .sf-sec4 li {
    font-size: 15px;
  }
}

/* -----------------------------
   MAIN TITLE (H2) — Montserrat
   ----------------------------- */
.sf-faq-title {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 900 !important;
  text-align: center !important;
  color: #084177 !important;
  margin-bottom: 24px;

  /* desktop heading range: 40 → 20 */
  font-size: clamp(35px, 3vw, 40px) !important;
}

@media (max-width: 520px){
  .sf-faq-title {
    /* mobile heading range: 25 → 15 */
    font-size: clamp(35px, 6vw, 35px) !important;
  }
}

/* -----------------------------
   FAQ QUESTION HEADINGS (summary)
   ----------------------------- */
.sf-faq-item summary {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: #084177; /* blue only */
  font-size: clamp(16px, 1.6vw, 16px);
}

@media (max-width: 520px){
  .sf-faq-item summary {
    font-size: clamp(15px, 5vw, 15px);
  }
}

/* -----------------------------
   FAQ ANSWER TEXT — Roboto
   ----------------------------- */
.sf-faq-content p {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: #084177; /* allowed palette only */
}

@media (max-width: 520px){
  .sf-faq-content p {
    font-size: 15px;
  }
}

/* -----------------------------
   ICON COLOURS (solid palette only)
   ----------------------------- */
.sf-faq-icon {
  background: #084177 !important; /* replaces blue→blue2 gradient */
  color: #ffffff !important;
  box-shadow: 0 4px 10px rgba(114,200,158,.25); /* green glow */
}

/* arrow colour fix */
.sf-faq-item summary::after {
  color: #084177 !important;
}/* End custom CSS */