/* ============================================================
   SEA LICENSING — SEAFARER LICENSING EXECUTIVE V15
   MAIN BODY ONLY
   Header / navigation / footer intentionally untouched
   ============================================================ */

.sl15-main{
  --navy:#002B49;
  --deep:#062C43;
  --ocean:#004E7C;
  --ocean2:#0B436D;
  --cyan:#0084D1;
  --cyan-hover:#0297E8;
  --paper:#F8FAFC;
  --paper2:#F0F4F8;
  --white:#FFFFFF;
  --ink:#082A40;
  --copy:#5E7483;
  --line:#E2E8F0;
  width:100%;
  overflow:hidden;
  background:#fff;
  color:var(--ink);
}

.sl15-main,
.sl15-main *{
  box-sizing:border-box;
}

.sl15-container{
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding-left:48px;
  padding-right:48px;
}

.sl15-eyebrow{
  display:block;
  margin:0 0 15px;
  color:var(--cyan);
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.20em;
  text-transform:uppercase;
}

.sl15-title{
  margin:0;
  color:var(--ink);
  font-size:46px;
  line-height:.98;
  font-weight:850;
  letter-spacing:-.045em;
}

.sl15-title-light{
  color:#fff;
}

.sl15-blue-rule{
  width:58px;
  height:2px;
  margin-top:21px;
  background:linear-gradient(
    90deg,
    var(--cyan),
    rgba(0,132,209,0)
  );
}

.sl15-dark-texture{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.055;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='180' viewBox='0 0 280 180'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1'%3E%3Cpath d='M0 28 C45 5 92 51 140 28 S235 5 280 28'/%3E%3Cpath d='M0 67 C45 44 92 90 140 67 S235 44 280 67'/%3E%3Cpath d='M0 106 C45 83 92 129 140 106 S235 83 280 106'/%3E%3Cpath d='M45 0V180M140 0V180M235 0V180' opacity='.30'/%3E%3Ccircle cx='140' cy='90' r='56' opacity='.25'/%3E%3Ccircle cx='140' cy='90' r='30' opacity='.18'/%3E%3C/g%3E%3C/svg%3E");
  background-size:280px 180px;
}


/* ============================================================
   HERO
   ============================================================ */

.sl15-hero{
  width:100%;
  min-height:540px;
  position:relative;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(
      circle at 52% 0%,
      #004E7C 0%,
      #002B49 70%
    );
}

.sl15-hero-photo{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:68%;
  background:
    url("/assets/images/seafarers-hero-premium-wide.jpg")
    center right / cover no-repeat;
  transition:transform 8s ease;
}

.sl15-hero:hover .sl15-hero-photo{
  transform:scale(1.018);
}

.sl15-hero-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      90deg,
      #002B49 0%,
      #002B49 34%,
      rgba(0,43,73,.96) 46%,
      rgba(0,43,73,.72) 59%,
      rgba(0,78,124,.24) 76%,
      rgba(0,78,124,.03) 100%
    );
}

.sl15-hero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(0,132,209,.85),
    transparent
  );
}

.sl15-hero .sl15-container{
  position:relative;
  z-index:4;
}

.sl15-hero-content{
  width:650px;
  max-width:100%;
}

.sl15-hero h1{
  max-width:650px;
  margin:0;
  color:#fff;
  font-size:64px;
  line-height:.95;
  font-weight:850;
  letter-spacing:-.052em;
}

.sl15-hero-lead{
  max-width:610px;
  margin:20px 0 0;
  color:rgba(255,255,255,.76);
  font-size:14px;
  line-height:1.65;
}

.sl15-hero-actions{
  display:flex;
  align-items:center;
  gap:13px;
  margin-top:29px;
}

.sl15-button{
  min-height:50px;
  padding:0 24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:1px solid transparent;
  font-size:11px;
  line-height:1;
  font-weight:850;
  transition:
    transform .25s ease,
    background .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}

.sl15-button:hover{
  transform:translateY(-2px);
}

.sl15-button-primary{
  color:#fff;
  background:var(--cyan);
  box-shadow:0 14px 32px rgba(0,132,209,.24);
}

.sl15-button-primary:hover{
  background:var(--cyan-hover);
  box-shadow:0 18px 40px rgba(0,132,209,.32);
}

.sl15-button-outline{
  color:#fff;
  border-color:rgba(255,255,255,.30);
  background:rgba(0,43,73,.22);
  backdrop-filter:blur(8px);
}

.sl15-button-outline:hover{
  border-color:var(--cyan);
  background:rgba(0,132,209,.12);
}


/* ============================================================
   SECTION 1 — APPROACH
   ============================================================ */

.sl15-approach{
  width:100%;
  padding:88px 0;
  position:relative;
  overflow:hidden;
  background:#fff;
}

.sl15-approach::after{
  content:"";
  position:absolute;
  width:640px;
  height:640px;
  right:-250px;
  top:-260px;
  border-radius:50%;
  border:1px solid rgba(0,132,209,.045);
  box-shadow:
    inset 0 0 0 90px rgba(0,132,209,.012),
    inset 0 0 0 180px rgba(0,132,209,.008);
}

.sl15-approach-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:430px minmax(0,1fr);
  gap:92px;
  align-items:center;
}

.sl15-approach-copy{
  max-width:415px;
  padding-left:26px;
  border-left:2px solid rgba(0,132,209,.34);
}

.sl15-approach-copy .sl15-title{
  max-width:400px;
}

.sl15-approach-cards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}

.sl15-approach-card{
  min-height:180px;
  padding:30px 30px 28px;
  position:relative;
  background:#fff;
  border:1px solid var(--line);
  border-left:4px solid var(--cyan);
  box-shadow:0 10px 30px rgba(0,43,73,.04);
  transition:
    transform .28s ease,
    border-color .28s ease,
    box-shadow .28s ease;
}

.sl15-approach-card:hover{
  transform:translateY(-4px);
  border-color:rgba(0,132,209,.38);
  border-left-color:var(--cyan);
  box-shadow:0 18px 42px rgba(0,43,73,.08);
}

.sl15-approach-number{
  display:block;
  margin-bottom:22px;
  color:var(--cyan);
  font-size:13px;
  line-height:1;
  font-weight:900;
  letter-spacing:.14em;
}

.sl15-approach-card p{
  margin:0;
  color:var(--copy);
  font-size:13px;
  line-height:1.7;
}


/* ============================================================
   SECTION 2 — SERVICE SCOPE
   ============================================================ */

.sl15-scope{
  width:100%;
  padding:84px 0 88px;
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(
      circle at 50% 0%,
      #004E7C 0%,
      #002B49 72%
    );
}

.sl15-scope-heading{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:70px;
  margin-bottom:40px;
}

.sl15-scope-heading-left{
  max-width:610px;
}

.sl15-scope-heading-left .sl15-title{
  max-width:590px;
}

.sl15-scope-heading p{
  max-width:600px;
  margin:0 0 3px;
  color:rgba(255,255,255,.64);
  font-size:12px;
  line-height:1.7;
}

.sl15-scope-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.sl15-scope-card{
  position:relative;
  min-height:245px;
  padding:31px;
  overflow:hidden;
  border-radius:12px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(0,132,209,.20);
  backdrop-filter:blur(10px);
  transition:
    transform .30s ease,
    border-color .30s ease,
    background .30s ease,
    box-shadow .30s ease;
}

.sl15-scope-card:hover{
  transform:translateY(-4px);
  border-color:var(--cyan);
  background:rgba(255,255,255,.06);
  box-shadow:0 20px 44px rgba(0,20,35,.16);
}

.sl15-icon{
  width:44px;
  height:44px;
  margin-bottom:26px;
  display:grid;
  place-items:center;
  border-radius:10px;
  color:#48BDED;
  background:rgba(0,132,209,.10);
  border:1px solid rgba(0,132,209,.28);
}

.sl15-icon svg{
  width:21px;
  height:21px;
}

.sl15-scope-card small{
  display:block;
  margin-bottom:10px;
  color:#4CBCEB;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.sl15-scope-card h3{
  margin:0 0 20px;
  color:#fff;
  font-size:23px;
  line-height:1.12;
}

.sl15-scope-items{
  display:grid;
  gap:12px;
}

.sl15-scope-items div{
  display:flex;
  gap:11px;
  align-items:flex-start;
  color:rgba(255,255,255,.75);
  font-size:11px;
  line-height:1.45;
}

.sl15-check{
  color:#43BAEE;
  font-weight:900;
}


/* ============================================================
   SECTION 3 — PREPARED
   ============================================================ */

.sl15-prepared{
  width:100%;
  padding:88px 0;
  background:#F8FAFC;
}

.sl15-prepared-layout{
  display:grid;
  grid-template-columns:350px minmax(0,1fr);
  gap:86px;
  align-items:center;
}

.sl15-prepared-copy{
  max-width:335px;
}

.sl15-prepared-copy .sl15-title{
  font-size:43px;
}

.sl15-prepared-copy p{
  margin:17px 0 0;
  color:var(--copy);
  font-size:11px;
  line-height:1.7;
}

.sl15-info-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.sl15-info-card{
  position:relative;
  min-height:142px;
  padding:25px;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 10px 25px rgba(0,43,73,.04);
  transition:
    transform .28s ease,
    border-color .28s ease,
    box-shadow .28s ease;
}

.sl15-info-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:var(--cyan);
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .28s ease;
}

.sl15-info-card:hover{
  transform:translateY(-4px);
  border-color:rgba(0,132,209,.34);
  box-shadow:0 18px 40px rgba(0,43,73,.08);
}

.sl15-info-card:hover::before{
  transform:scaleY(1);
}

.sl15-info-card small{
  display:block;
  margin-bottom:23px;
  color:var(--cyan);
  font-size:10px;
  line-height:1;
  font-weight:900;
  letter-spacing:.13em;
}

.sl15-info-card strong{
  display:block;
  color:var(--ink);
  font-size:12px;
  line-height:1.45;
}


/* ============================================================
   SECTION 4 — CENTERED WORKFLOW
   ============================================================ */

.sl15-workflow{
  width:100%;
  padding:84px 0 90px;
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(
      circle at 50% 0%,
      #004E7C 0%,
      #002B49 72%
    );
}

.sl15-workflow-head{
  position:relative;
  z-index:2;
  max-width:760px;
  margin:0 auto 66px;
  text-align:center;
}

.sl15-workflow-head .sl15-eyebrow{
  text-align:center;
}

.sl15-workflow-head h2{
  margin:0;
  color:#fff;
  font-size:45px;
  line-height:.98;
  font-weight:850;
  letter-spacing:-.045em;
}

.sl15-workflow-head p{
  max-width:650px;
  margin:18px auto 0;
  color:rgba(255,255,255,.62);
  font-size:12px;
  line-height:1.7;
}

.sl15-stepper{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:68px;
  padding-top:39px;
}

.sl15-stepper::before{
  content:"";
  position:absolute;
  top:8px;
  left:8px;
  right:8px;
  height:2px;
  background:
    linear-gradient(
      90deg,
      var(--cyan),
      rgba(0,132,209,.42),
      var(--cyan)
    );
}

.sl15-step{
  position:relative;
  padding-top:10px;
}

.sl15-step::before{
  content:"";
  position:absolute;
  left:0;
  top:-37px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:#002B49;
  border:3px solid #37B6ED;
  box-shadow:
    0 0 0 6px rgba(0,132,209,.13),
    0 0 22px rgba(0,132,209,.18);
}

.sl15-step-number{
  display:block;
  margin-bottom:10px;
  color:#47BDED;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.15em;
}

.sl15-step h3{
  margin:0;
  color:#fff;
  font-size:22px;
  line-height:1.1;
}

.sl15-step p{
  max-width:290px;
  margin:9px 0 0;
  color:rgba(255,255,255,.64);
  font-size:10.5px;
  line-height:1.55;
}


/* ============================================================
   SECTION 5 — RELATED SERVICES
   ============================================================ */

.sl15-related{
  width:100%;
  padding:88px 0 92px;
  background:#fff;
}

.sl15-related-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:50px;
  margin-bottom:40px;
}

.sl15-related-head-copy{
  max-width:720px;
}

.sl15-related-head-copy .sl15-title{
  max-width:690px;
}

.sl15-all-services{
  flex:0 0 auto;
  margin-bottom:6px;
  color:var(--cyan);
  font-size:11px;
  font-weight:850;
  transition:
    transform .25s ease,
    color .25s ease;
}

.sl15-all-services:hover{
  color:var(--cyan-hover);
  transform:translateX(4px);
}

.sl15-related-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.sl15-service-card{
  position:relative;
  overflow:hidden;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 10px 30px rgba(0,43,73,.04);
  transition:
    transform .30s ease,
    border-color .30s ease,
    box-shadow .30s ease;
}

.sl15-service-card::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  z-index:5;
  height:4px;
  background:var(--cyan);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .30s ease;
}

.sl15-service-card:hover{
  transform:translateY(-5px);
  border-color:rgba(0,132,209,.38);
  box-shadow:0 20px 46px rgba(0,43,73,.10);
}

.sl15-service-card:hover::before{
  transform:scaleX(1);
}

.sl15-service-image{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
}

.sl15-service-image::before{
  content:"";
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  transition:transform .55s ease;
}

.sl15-service-card:hover .sl15-service-image::before{
  transform:scale(1.055);
}

.sl15-service-card.training .sl15-service-image::before{
  background-image:url("/assets/images/services/final/seafarer.jpg");
}

.sl15-service-card.seafarers .sl15-service-image::before{
  background-image:url("/assets/images/hero-seafarers.jpg");
}

.sl15-service-card.request .sl15-service-image::before{
  background-image:url("/assets/images/insights/insight-seafarer-certification.webp");
}

.sl15-service-body{
  min-height:190px;
  padding:24px;
  display:flex;
  flex-direction:column;
}

.sl15-service-body h3{
  margin:0;
  color:var(--ink);
  font-size:20px;
  line-height:1.2;
}

.sl15-service-body p{
  margin:11px 0 0;
  color:var(--copy);
  font-size:11px;
  line-height:1.6;
}

.sl15-explore{
  margin-top:auto;
  padding-top:24px;
  color:var(--cyan);
  font-size:10px;
  font-weight:900;
}


/* ============================================================
   SECTION 6 — CTA
   ============================================================ */

.sl15-cta-section{
  width:100%;
  padding:0 0 88px;
  background:#fff;
}

.sl15-cta{
  position:relative;
  min-height:200px;
  padding:45px 50px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:85px;
  align-items:center;
  overflow:hidden;
  border-radius:16px;
  border:1px solid rgba(0,132,209,.20);
  background:
    radial-gradient(
      circle at 75% 0%,
      #004E7C 0%,
      #002B49 72%
    );
  box-shadow:0 18px 46px rgba(0,43,73,.12);
}

.sl15-cta-copy{
  position:relative;
  z-index:2;
}

.sl15-cta-copy h2{
  max-width:760px;
  margin:0;
  color:#fff;
  font-size:34px;
  line-height:1.04;
  font-weight:850;
  letter-spacing:-.035em;
}

.sl15-cta-copy p{
  max-width:720px;
  margin:11px 0 0;
  color:rgba(255,255,255,.64);
  font-size:10.5px;
  line-height:1.65;
}

.sl15-cta-button{
  position:relative;
  z-index:2;
  min-width:185px;
  min-height:52px;
  padding:0 26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:var(--cyan);
  border:1px solid var(--cyan);
  border-radius:6px;
  box-shadow:0 14px 32px rgba(0,132,209,.24);
  font-size:11px;
  font-weight:900;
  transition:
    transform .25s ease,
    background .25s ease,
    box-shadow .25s ease;
}

.sl15-cta-button:hover{
  transform:translateY(-2px);
  background:var(--cyan-hover);
  box-shadow:0 19px 40px rgba(0,132,209,.32);
}


/* Desktop scaling safeguard only */
@media(max-width:1150px){
  .sl15-container{
    padding-left:32px;
    padding-right:32px;
  }

  .sl15-approach-grid,
  .sl15-prepared-layout{
    grid-template-columns:360px minmax(0,1fr);
    gap:55px;
  }

  .sl15-scope-heading{
    gap:45px;
  }
}


/* ==========================================================
   HERO — EXACT HEADER SHELL ALIGNMENT
   Desktop only
   Align hero copy directly beneath header logo.
   NOTHING ELSE CHANGED.
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-hero .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }

  .sl15-main .sl15-hero-content{
    margin-left:0 !important;
  }

}


/* ==========================================================
   HOW WE APPROACH IT — EXACT HEADER SHELL ALIGNMENT
   Desktop only
   Nothing else changed
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-approach > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }

}


/* ==========================================================
   SERVICE SCOPE — EXACT HEADER SHELL ALIGNMENT
   Desktop only
   Align heading, intro and 3 cards with header/footer grid
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-scope > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }

}


/* ==========================================================
   SERVICE SCOPE — PROPORTIONAL HEADER GEOMETRY
   Title = exact width of card 1
   Description = exact span of cards 2 + 3
   Desktop only
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-scope-heading{
    display:grid !important;

    grid-template-columns:
      repeat(3,minmax(0,1fr)) !important;

    column-gap:22px !important;

    align-items:center !important;

    margin-bottom:40px !important;
  }


  .sl15-main .sl15-scope-heading-left{
    grid-column:1 !important;

    width:100% !important;
    max-width:none !important;

    align-self:center !important;
  }


  .sl15-main .sl15-scope-heading-left .sl15-title{
    width:100% !important;
    max-width:360px !important;

    margin:0 !important;

    font-size:40px !important;
    line-height:1.02 !important;
  }


  .sl15-main .sl15-scope-heading > p{
    grid-column:2 / 4 !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;

    padding-left:34px !important;
    padding-right:40px !important;

    border-left:
      1px solid rgba(0,132,209,.28) !important;

    align-self:center !important;

    color:rgba(255,255,255,.68) !important;

    font-size:12px !important;
    line-height:1.72 !important;
  }

}


/* ==========================================================
   SERVICE SCOPE — DESCRIPTION TEXT REFINEMENT
   White text + slightly larger font
   Nothing else changed
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-scope-heading > p{
    color:#FFFFFF !important;

    font-size:14px !important;
    line-height:1.65 !important;

    font-weight:400 !important;
  }

}


/* ==========================================================
   SERVICE SCOPE — DESCRIPTION SEPARATOR REFINEMENT
   Shorter / centered / proportional
   Nothing else changed
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-scope-heading > p{
    position:relative !important;

    border-left:0 !important;

    padding-left:36px !important;
  }


  .sl15-main .sl15-scope-heading > p::before{
    content:"" !important;

    position:absolute !important;

    left:0 !important;
    top:50% !important;

    width:1px !important;
    height:46px !important;

    transform:translateY(-50%) !important;

    background:
      linear-gradient(
        180deg,
        rgba(0,132,209,.18) 0%,
        rgba(0,132,209,.85) 50%,
        rgba(0,132,209,.18) 100%
      ) !important;
  }

}


/* ==========================================================
   START PREPARED — EXACT HEADER SHELL ALIGNMENT
   Desktop only
   Text begins directly below header logo
   Right cards align with header/footer right grid
   Nothing else changed
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-prepared > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }

}


/* ==========================================================
   TYPICAL WORKFLOW — EXACT HEADER SHELL ALIGNMENT
   Desktop only
   Heading begins directly beneath header logo
   Timeline stays within same header/footer grid
   Nothing else changed
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-workflow > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }


  .sl15-main .sl15-workflow-head{
    width:100% !important;
    max-width:none !important;

    margin-left:0 !important;
    margin-right:0 !important;
    margin-bottom:66px !important;

    text-align:left !important;
  }


  .sl15-main .sl15-workflow-head .sl15-eyebrow{
    text-align:left !important;
  }


  .sl15-main .sl15-workflow-head h2{
    max-width:760px !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }


  .sl15-main .sl15-workflow-head p{
    max-width:720px !important;

    margin-left:0 !important;
    margin-right:0 !important;
  }

}

/* ==========================================================
   WORKFLOW TIMELINE — CONTINUOUS LINE ANIMATION
   Adds a moving cyan light across the horizontal line
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-timeline{
    position:relative !important;
    overflow:hidden !important;
  }

  .sl15-main .sl15-timeline::after{
    content:"";
    position:absolute;
    top:8px;
    left:-22%;
    width:22%;
    height:3px;
    border-radius:999px;
    pointer-events:none;
    z-index:3;

    background:linear-gradient(
      90deg,
      rgba(0,132,209,0) 0%,
      rgba(0,132,209,.10) 12%,
      rgba(78,183,232,.60) 35%,
      rgba(122,214,255,.95) 50%,
      rgba(78,183,232,.60) 65%,
      rgba(0,132,209,.10) 88%,
      rgba(0,132,209,0) 100%
    );

    box-shadow:
      0 0 8px rgba(0,132,209,.45),
      0 0 18px rgba(0,132,209,.28);

    animation: sl15TimelineFlow 3.2s linear infinite;
  }
}

@keyframes sl15TimelineFlow{
  0%{
    left:-22%;
  }
  100%{
    left:100%;
  }
}

@media (prefers-reduced-motion: reduce){
  .sl15-main .sl15-timeline::after{
    animation:none !important;
    opacity:.45 !important;
  }
}


/* ==========================================================
   WORKFLOW — CONTINUOUS PREMIUM CYAN FLOW
   Correct selector: .sl15-stepper
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-stepper{
    position:relative !important;
    overflow:hidden !important;
  }

  /* permanent base line */
  .sl15-main .sl15-stepper::before{
    background:
      linear-gradient(
        90deg,
        rgba(0,132,209,.32) 0%,
        rgba(0,132,209,.72) 50%,
        rgba(0,132,209,.32) 100%
      ) !important;

    box-shadow:
      0 0 8px rgba(0,132,209,.14) !important;
  }

  /* continuously travelling illuminated beam */
  .sl15-main .sl15-stepper::after{
    content:"" !important;

    position:absolute !important;

    top:7px !important;
    left:-24% !important;

    width:24% !important;
    height:4px !important;

    z-index:1 !important;

    border-radius:999px !important;

    pointer-events:none !important;

    background:
      linear-gradient(
        90deg,
        rgba(0,132,209,0) 0%,
        rgba(0,132,209,.18) 18%,
        rgba(71,189,237,.72) 38%,
        rgba(151,225,255,1) 50%,
        rgba(71,189,237,.72) 62%,
        rgba(0,132,209,.18) 82%,
        rgba(0,132,209,0) 100%
      ) !important;

    box-shadow:
      0 0 8px rgba(68,192,245,.85),
      0 0 18px rgba(0,132,209,.55),
      0 0 28px rgba(0,132,209,.26) !important;

    animation:
      sl15WorkflowBeam 2.8s linear infinite !important;
  }

  .sl15-main .sl15-step{
    position:relative !important;
    z-index:2 !important;
  }

  .sl15-main .sl15-step::before{
    z-index:3 !important;
  }

}


@keyframes sl15WorkflowBeam{

  0%{
    left:-24%;
  }

  100%{
    left:100%;
  }

}


@media (prefers-reduced-motion:reduce){

  .sl15-main .sl15-stepper::after{
    animation:none !important;
    display:none !important;
  }

}


/* ==========================================================
   WORKFLOW — FINAL CENTERED / SYMMETRICAL / ANIMATED
   Scope: Workflow section only
   ========================================================== */

@media (min-width:1101px){

  /* Center complete section heading */
  .sl15-main .sl15-workflow-head{
    width:100% !important;
    max-width:900px !important;

    margin:
      0 auto 68px auto !important;

    text-align:center !important;
  }


  .sl15-main .sl15-workflow-head .sl15-eyebrow{
    width:100% !important;

    text-align:center !important;

    margin-left:auto !important;
    margin-right:auto !important;
  }


  .sl15-main .sl15-workflow-head h2{
    width:100% !important;
    max-width:820px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    text-align:center !important;
  }


  .sl15-main .sl15-workflow-head p{
    width:100% !important;
    max-width:760px !important;

    margin:
      18px auto 0 auto !important;

    text-align:center !important;

    color:rgba(255,255,255,.76) !important;

    font-size:12px !important;
    line-height:1.65 !important;
  }


  /* ------------------------------------------
     CENTER THE THREE STEPS SYMMETRICALLY
     ------------------------------------------ */

  .sl15-main .sl15-stepper{
    position:relative !important;

    display:grid !important;

    grid-template-columns:
      repeat(3,minmax(0,1fr)) !important;

    gap:0 !important;

    width:100% !important;

    padding-top:42px !important;

    overflow:visible !important;
  }


  .sl15-main .sl15-step{
    position:relative !important;

    width:100% !important;

    padding:
      10px 32px 0 32px !important;

    text-align:center !important;
  }


  .sl15-main .sl15-step-number{
    display:block !important;

    text-align:center !important;
  }


  .sl15-main .sl15-step h3{
    text-align:center !important;
  }


  .sl15-main .sl15-step p{
    max-width:300px !important;

    margin:
      9px auto 0 auto !important;

    text-align:center !important;
  }


  /* ------------------------------------------
     CENTER NODES DIRECTLY OVER EACH COLUMN
     ------------------------------------------ */

  .sl15-main .sl15-step::before{
    left:50% !important;

    top:-40px !important;

    transform:
      translateX(-50%) !important;

    width:16px !important;
    height:16px !important;

    border:
      3px solid #49C5F7 !important;

    background:
      #002B49 !important;

    box-shadow:
      0 0 0 6px rgba(0,132,209,.14),
      0 0 18px rgba(0,170,240,.30) !important;

    z-index:5 !important;
  }


  /* ------------------------------------------
     ANIMATE THE ACTUAL CONNECTOR LINE
     Node 1 center -> Node 3 center
     ------------------------------------------ */

  .sl15-main .sl15-stepper::before{
    content:"" !important;

    position:absolute !important;

    top:8px !important;

    left:16.666666% !important;
    right:16.666666% !important;

    width:auto !important;
    height:3px !important;

    border-radius:999px !important;

    z-index:1 !important;

    background:
      linear-gradient(
        90deg,

        rgba(0,132,209,.32) 0%,
        rgba(0,132,209,.42) 25%,

        rgba(59,190,245,.75) 39%,

        rgba(135,225,255,.98) 46%,

        #FFFFFF 50%,

        rgba(135,225,255,.98) 54%,

        rgba(59,190,245,.75) 61%,

        rgba(0,132,209,.42) 75%,

        rgba(0,132,209,.32) 100%
      ) !important;

    background-size:
      260% 100% !important;

    background-position:
      200% 0 !important;

    box-shadow:
      0 0 5px rgba(0,132,209,.40),
      0 0 12px rgba(0,132,209,.18) !important;

    animation:
      sl15WorkflowLineTravel 2.4s linear infinite !important;
  }


  /* Remove previous failed overlay beam */
  .sl15-main .sl15-stepper::after{
    display:none !important;
    content:none !important;
    animation:none !important;
  }

}


/* ==========================================================
   CONTINUOUS CYAN ENERGY FLOW
   ========================================================== */

@keyframes sl15WorkflowLineTravel{

  0%{
    background-position:
      200% 0;
  }

  100%{
    background-position:
      -60% 0;
  }

}


/* ==========================================================
   WORKFLOW — HIGH VISIBILITY CONTINUOUS MOVING LIGHT
   Scope: connector line only
   ========================================================== */

@media (min-width:1101px){

  /* Base connector line */
  .sl15-main .sl15-stepper::before{
    content:"" !important;

    position:absolute !important;

    top:8px !important;
    left:16.666666% !important;
    right:16.666666% !important;

    width:auto !important;
    height:2px !important;

    border-radius:999px !important;

    background:
      rgba(0,132,209,.58) !important;

    box-shadow:
      0 0 8px rgba(0,132,209,.20) !important;

    animation:none !important;

    z-index:1 !important;
  }


  /* Moving illuminated pulse */
  .sl15-main .sl15-stepper::after{
    content:"" !important;

    display:block !important;

    position:absolute !important;

    top:5px !important;

    left:calc(16.666666% - 3px) !important;

    width:135px !important;
    height:8px !important;

    border-radius:999px !important;

    pointer-events:none !important;

    z-index:4 !important;

    background:
      linear-gradient(
        90deg,
        rgba(0,132,209,0) 0%,
        rgba(0,132,209,.18) 18%,
        rgba(53,190,244,.55) 38%,
        rgba(108,215,255,.90) 58%,
        #FFFFFF 82%,
        rgba(255,255,255,0) 100%
      ) !important;

    filter:
      drop-shadow(0 0 5px rgba(90,210,255,.90))
      drop-shadow(0 0 11px rgba(0,132,209,.65)) !important;

    opacity:1 !important;

    animation:
      sl15WorkflowVisiblePulse 2.6s linear infinite !important;
  }


  /* Keep nodes above the moving line */
  .sl15-main .sl15-step::before{
    z-index:6 !important;
  }

}


@keyframes sl15WorkflowVisiblePulse{

  0%{
    left:calc(16.666666% - 135px);
    opacity:0;
  }

  6%{
    opacity:1;
  }

  92%{
    opacity:1;
  }

  100%{
    left:calc(83.333333% - 2px);
    opacity:0;
  }

}


/* ==========================================================
   WORKFLOW — FINAL CONTINUOUS TRAVELLING LIGHT
   FIX: animate TRANSFORM instead of LEFT
   Layout / centering unchanged
   ========================================================== */

@media (min-width:1101px){

  /* Keep permanent connector line */
  .sl15-main .sl15-stepper::before{
    content:"" !important;

    position:absolute !important;

    top:8px !important;
    left:16.666666% !important;
    right:16.666666% !important;

    width:auto !important;
    height:2px !important;

    border-radius:999px !important;

    background:
      linear-gradient(
        90deg,
        rgba(0,132,209,.38),
        rgba(74,194,241,.72),
        rgba(0,132,209,.38)
      ) !important;

    box-shadow:
      0 0 8px rgba(0,132,209,.24) !important;

    z-index:1 !important;

    animation:none !important;
  }


  /* Moving beam */
  .sl15-main .sl15-stepper::after{
    content:"" !important;

    display:block !important;

    position:absolute !important;

    top:4px !important;

    /* fixed starting point = first node */
    left:16.666666% !important;
    right:auto !important;

    /* percentage width allows predictable transform travel */
    width:10% !important;
    height:10px !important;

    border-radius:999px !important;

    pointer-events:none !important;

    z-index:4 !important;

    opacity:1 !important;

    background:
      linear-gradient(
        90deg,
        rgba(0,132,209,0) 0%,
        rgba(0,153,224,.12) 12%,
        rgba(39,183,241,.38) 30%,
        rgba(94,211,255,.82) 55%,
        rgba(205,245,255,1) 78%,
        #FFFFFF 88%,
        rgba(255,255,255,0) 100%
      ) !important;

    filter:
      drop-shadow(0 0 4px rgba(128,225,255,.95))
      drop-shadow(0 0 10px rgba(0,163,232,.75))
      drop-shadow(0 0 18px rgba(0,132,209,.48)) !important;

    will-change:transform !important;

    animation:
      sl15WorkflowTravelFinal 2.5s linear infinite !important;
  }


  /* Nodes stay over the travelling light */
  .sl15-main .sl15-step::before{
    z-index:6 !important;
  }

}


/* Beam begins just before Assess
   and travels continuously through Progress */

@keyframes sl15WorkflowTravelFinal{

  0%{
    transform:translateX(-100%);
  }

  100%{
    transform:translateX(566.666%);
  }

}

/* ==========================================================
   WORKFLOW — PREMIUM SOFT TRAVELLING LIGHT
   Softer, slimmer, slower, more elegant
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-stepper::before{
    height:1px !important;
    background:linear-gradient(
      90deg,
      rgba(0,132,209,.22),
      rgba(92,196,241,.42),
      rgba(0,132,209,.22)
    ) !important;
    box-shadow:none !important;
    opacity:.95 !important;
  }

  .sl15-main .sl15-stepper::after{
    content:"" !important;
    position:absolute !important;
    top:5px !important;
    left:16.666666% !important;
    width:8% !important;
    height:6px !important;
    border-radius:999px !important;
    z-index:4 !important;
    pointer-events:none !important;

    background:linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(132,223,255,.05) 14%,
      rgba(132,223,255,.12) 28%,
      rgba(170,238,255,.28) 44%,
      rgba(255,255,255,.68) 56%,
      rgba(170,238,255,.22) 70%,
      rgba(132,223,255,.08) 84%,
      rgba(255,255,255,0) 100%
    ) !important;

    filter:
      drop-shadow(0 0 4px rgba(130,225,255,.18))
      drop-shadow(0 0 10px rgba(0,132,209,.10)) !important;

    opacity:.78 !important;
    will-change:transform, opacity !important;
    animation:sl15WorkflowTravelPremium 5.8s ease-in-out infinite !important;
  }

  .sl15-main .sl15-step::before{
    z-index:6 !important;
  }
}

@keyframes sl15WorkflowTravelPremium{
  0%{
    transform:translateX(-35%);
    opacity:0;
  }
  8%{
    opacity:.22;
  }
  18%{
    opacity:.48;
  }
  32%{
    opacity:.72;
  }
  50%{
    opacity:.82;
  }
  68%{
    opacity:.72;
  }
  84%{
    opacity:.45;
  }
  100%{
    transform:translateX(742%);
    opacity:0;
  }
}


/* ==========================================================
   RELATED SERVICES — EXACT HEADER SHELL ALIGNMENT
   Desktop only
   Heading aligns under logo
   Cards align with header/footer right boundary
   Nothing else changed
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-related > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }


  .sl15-main .sl15-related-head{
    width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;
  }


  .sl15-main .sl15-related-head-copy{
    max-width:760px !important;
  }

}


/* ==========================================================
   RELATED SERVICES — SUBTLE MARITIME TEXTURE BACKGROUND
   Only affects the background behind this section
   ========================================================== */

.sl15-main .sl15-related{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,#fbfdff 0%,#f4f8fb 100%) !important;
}

.sl15-main .sl15-related > .sl15-container{
  position:relative !important;
  z-index:2 !important;
}

.sl15-main .sl15-related::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.12;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='960' height='240' viewBox='0 0 960 240'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='1'%3E%3Cpath d='M0 40 C40 20 80 20 120 40 S200 60 240 40 S320 20 360 40 S440 60 480 40 S560 20 600 40 S680 60 720 40 S800 20 840 40 S920 60 960 40'/%3E%3Cpath d='M0 100 C40 80 80 80 120 100 S200 120 240 100 S320 80 360 100 S440 120 480 100 S560 80 600 100 S680 120 720 100 S800 80 840 100 S920 120 960 100'/%3E%3Cpath d='M0 160 C40 140 80 140 120 160 S200 180 240 160 S320 140 360 160 S440 180 480 160 S560 140 600 160 S680 180 720 160 S800 140 840 160 S920 180 960 160'/%3E%3Cpath d='M0 220 C40 200 80 200 120 220 S200 240 240 220 S320 200 360 220 S440 240 480 220 S560 200 600 220 S680 240 720 220 S800 200 840 220 S920 240 960 220'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:960px 240px;
}

.sl15-main .sl15-related::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  opacity:.45;
  background:
    radial-gradient(circle at 12% 20%, rgba(0,132,209,.05) 0%, transparent 34%),
    radial-gradient(circle at 86% 26%, rgba(0,78,124,.05) 0%, transparent 30%),
    radial-gradient(circle at 50% 100%, rgba(0,132,209,.04) 0%, transparent 28%);
}

.sl15-main .sl15-related-head,
.sl15-main .sl15-related-grid,
.sl15-main .sl15-related-card{
  position:relative;
  z-index:2;
}



/* ==========================================================
   RELATED SERVICES — FINAL SYMMETRY + PROPORTION
   Scope: this section only
   ========================================================== */

@media (min-width:1101px){

  /* balanced outer spacing */
  .sl15-main .sl15-related{
    padding-top:68px !important;
    padding-bottom:70px !important;
  }


  /* exact header/footer shell */
  .sl15-main .sl15-related > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }


  /* title + right link become one balanced row */
  .sl15-main .sl15-related-head{
    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    column-gap:60px !important;

    align-items:end !important;

    margin:0 0 30px 0 !important;
  }


  .sl15-main .sl15-related-head-copy{
    width:100% !important;
    max-width:720px !important;
  }


  .sl15-main .sl15-related-head-copy .sl15-title{
    max-width:680px !important;

    font-size:42px !important;
    line-height:1.02 !important;

    letter-spacing:-.04em !important;
  }


  .sl15-main .sl15-related-head .sl15-eyebrow{
    margin-bottom:12px !important;
  }


  .sl15-main .sl15-related-head .sl15-blue-rule{
    margin-top:17px !important;
  }


  .sl15-main .sl15-all-services{
    align-self:end !important;

    margin:0 0 7px 0 !important;

    padding:0 !important;

    font-size:10px !important;
    line-height:1 !important;

    white-space:nowrap !important;
  }


  /* perfectly equal 3-column grid */
  .sl15-main .sl15-related-grid{
    display:grid !important;

    grid-template-columns:
      repeat(3,minmax(0,1fr)) !important;

    gap:22px !important;

    align-items:stretch !important;
  }


  /* equal card geometry */
  .sl15-main .sl15-service-card{
    display:flex !important;
    flex-direction:column !important;

    width:100% !important;
    height:100% !important;

    border-radius:8px !important;
  }


  /* restrained image height */
  .sl15-main .sl15-service-image{
    width:100% !important;

    aspect-ratio:16 / 9 !important;

    flex:0 0 auto !important;
  }


  /* shorter, cleaner card body */
  .sl15-main .sl15-service-body{
    min-height:150px !important;

    padding:
      20px 22px 19px !important;

    display:flex !important;
    flex-direction:column !important;
  }


  .sl15-main .sl15-service-body h3{
    margin:0 !important;

    font-size:18px !important;
    line-height:1.16 !important;
  }


  .sl15-main .sl15-service-body p{
    margin:9px 0 0 !important;

    min-height:34px !important;

    font-size:10px !important;
    line-height:1.55 !important;
  }


  .sl15-main .sl15-explore{
    margin-top:auto !important;

    padding-top:17px !important;

    font-size:9px !important;
  }


  /* keep texture elegant, not decorative */
  .sl15-main .sl15-related::before{
    opacity:.075 !important;
  }


  .sl15-main .sl15-related::after{
    opacity:.30 !important;
  }

}


/* ==========================================================
   RELATED SERVICES — FINAL CARD IMAGES
   Images only — no layout/design changes
   ========================================================== */

/* Training Services */
.sl15-main
.sl15-service-card.training
.sl15-service-image::before{
  background-image:
    url("/assets/images/services/related/maritime_officers_navigating_at_sunset.webp") !important;

  background-position:center center !important;
}


/* Seafarers */
.sl15-main
.sl15-service-card.seafarers
.sl15-service-image::before{
  background-image:
    url("/assets/images/services/related/captain_overlooking_sunset_shipping_lanes.webp") !important;

  background-position:center center !important;
}


/* Service Request */
.sl15-main
.sl15-service-card.request
.sl15-service-image::before{
  background-image:
    url("/assets/images/services/related/maritime_officer_reviewing_documents_at_sunset.webp") !important;

  background-position:center center !important;
}


/* ==========================================================
   RELATED SERVICES — PREMIUM IMAGE TREATMENT
   Normal = darker maritime cinematic tone
   Hover = elegant desaturated / grey image
   Scope: related-service images only
   ========================================================== */

.sl15-main .sl15-service-image{
  position:relative !important;
  overflow:hidden !important;

  background:#062C43 !important;
}


/* Actual image */
.sl15-main .sl15-service-image::before{
  z-index:1 !important;

  filter:
    brightness(.78)
    saturate(.82)
    contrast(1.04) !important;

  transform:scale(1.01) !important;

  transition:
    transform .75s cubic-bezier(.2,.7,.2,1),
    filter .65s ease !important;
}


/* Premium black/navy overlay */
.sl15-main .sl15-service-image::after{
  content:"" !important;

  position:absolute !important;
  inset:0 !important;

  z-index:2 !important;

  pointer-events:none !important;

  background:
    linear-gradient(
      180deg,
      rgba(2,18,30,.10) 0%,
      rgba(2,25,41,.18) 48%,
      rgba(0,23,39,.38) 100%
    ),
    linear-gradient(
      90deg,
      rgba(0,20,34,.14) 0%,
      transparent 45%,
      rgba(0,20,34,.08) 100%
    ) !important;

  opacity:1 !important;

  transition:
    background .65s ease,
    opacity .65s ease !important;
}


/* ----------------------------------------------------------
   HOVER — GREY / EXECUTIVE MARITIME EFFECT
   ---------------------------------------------------------- */

.sl15-main .sl15-service-card:hover
.sl15-service-image::before{

  transform:scale(1.055) !important;

  filter:
    grayscale(1)
    brightness(.68)
    contrast(1.08)
    saturate(.15) !important;
}


.sl15-main .sl15-service-card:hover
.sl15-service-image::after{

  background:
    linear-gradient(
      180deg,
      rgba(0,24,40,.08) 0%,
      rgba(0,30,50,.18) 50%,
      rgba(0,25,43,.44) 100%
    ) !important;
}


/* subtle cyan edge glow on image during hover */
.sl15-main .sl15-service-card:hover
.sl15-service-image{

  box-shadow:
    inset 0 3px 0 #0084D1,
    inset 0 -1px 0 rgba(0,132,209,.18) !important;
}



/* ==========================================================
   FINAL CTA — SYMMETRY / PROPORTION / HEADER ALIGNMENT
   Scope: final CTA only
   ========================================================== */

@media (min-width:1101px){

  /* remove excessive white breathing space */
  .sl15-main .sl15-cta-section{
    padding-top:54px !important;
    padding-bottom:58px !important;

    background:
      linear-gradient(
        180deg,
        #ffffff 0%,
        #f7fafc 100%
      ) !important;
  }


  /* exact same horizontal shell as header/footer */
  .sl15-main .sl15-cta-section > .sl15-container{
    width:min(
      calc(100% - 96px),
      var(--shell,1440px)
    ) !important;

    max-width:none !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }


  /* wider, cleaner executive banner */
  .sl15-main .sl15-cta{
    width:100% !important;

    min-height:166px !important;

    padding:
      34px 42px !important;

    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    column-gap:72px !important;

    align-items:center !important;

    border-radius:12px !important;

    background:
      radial-gradient(
        circle at 78% 0%,
        #0B436D 0%,
        #002B49 72%
      ) !important;

    box-shadow:
      0 18px 42px rgba(0,43,73,.11) !important;
  }


  /* left copy */
  .sl15-main .sl15-cta-copy{
    width:100% !important;
    max-width:820px !important;
  }


  .sl15-main .sl15-cta-copy .sl15-eyebrow{
    margin-bottom:12px !important;
  }


  .sl15-main .sl15-cta-copy h2{
    max-width:760px !important;

    margin:0 !important;

    font-size:32px !important;
    line-height:1.05 !important;

    letter-spacing:-.035em !important;
  }


  .sl15-main .sl15-cta-copy p{
    max-width:720px !important;

    margin:9px 0 0 !important;

    color:rgba(255,255,255,.72) !important;

    font-size:10.5px !important;
    line-height:1.55 !important;
  }


  /* right CTA */
  .sl15-main .sl15-cta-button{
    min-width:182px !important;
    min-height:50px !important;

    padding:0 25px !important;

    align-self:center !important;

    border-radius:5px !important;

    background:#0084D1 !important;

    box-shadow:
      0 10px 28px rgba(0,132,209,.22) !important;
  }


  .sl15-main .sl15-cta-button:hover{
    transform:translateY(-2px) !important;

    background:#0295DF !important;

    box-shadow:
      0 16px 34px rgba(0,132,209,.30) !important;
  }

}


/* ==========================================================
   RELATED SERVICES — REMOVE NORMAL DARK IMAGE TREATMENT
   Keep existing grayscale hover effect
   ========================================================== */

/* Restore original image brightness */
.sl15-main .sl15-related .sl15-service-image::before{
  filter:none !important;
  opacity:1 !important;
}


/* Remove black/navy gradient overlay completely */
.sl15-main .sl15-related .sl15-service-image::after{
  background:transparent !important;
  background-image:none !important;
  opacity:0 !important;
  box-shadow:none !important;
}


/* Keep premium grey hover effect */
.sl15-main .sl15-related
.sl15-service-card:hover
.sl15-service-image::before{
  filter:
    grayscale(1)
    brightness(.78)
    contrast(1.06) !important;

  transform:scale(1.045) !important;
}


/* Do not add another dark overlay on hover */
.sl15-main .sl15-related
.sl15-service-card:hover
.sl15-service-image::after{
  background:transparent !important;
  background-image:none !important;
  opacity:0 !important;
}


/* ==========================================================
   RELATED SERVICES — TEXT READABILITY
   Scope: card text only
   ========================================================== */

@media (min-width:1101px){

  .sl15-main .sl15-related .sl15-service-body h3{
    color:#062C43 !important;

    font-size:20px !important;
    line-height:1.18 !important;

    font-weight:800 !important;
    letter-spacing:-.015em !important;
  }


  .sl15-main .sl15-related .sl15-service-body p{
    color:#425E70 !important;

    font-size:12px !important;
    line-height:1.65 !important;

    font-weight:450 !important;

    max-width:95% !important;
  }


  .sl15-main .sl15-related .sl15-explore{
    color:#0084D1 !important;

    font-size:10.5px !important;
    line-height:1 !important;

    font-weight:850 !important;

    letter-spacing:.01em !important;
  }


  .sl15-main .sl15-related .sl15-service-card:hover .sl15-explore{
    color:#006EAE !important;
  }

}

/* ==========================================================
   START PREPARED — FADED VECTOR IMAGES BEHIND CARDS
   Very light maritime vector background inside info cards
   ========================================================== */

.sl15-main .sl15-prepared .sl15-info-card{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
}

.sl15-main .sl15-prepared .sl15-info-card > *{
  position:relative;
  z-index:2;
}

.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card::after{
  content:"";
  position:absolute;
  right:-10px;
  bottom:-10px;
  width:118px;
  height:118px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  opacity:.055;
  filter:grayscale(100%);
  pointer-events:none;
  z-index:1;
  transition:opacity .35s ease, transform .35s ease;
}

.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:hover::after{
  opacity:.075;
  transform:scale(1.03);
}

/* 01 — certificate / seal */
.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:nth-child(1)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M33 23h34l20 20v44a9 9 0 0 1-9 9H33a9 9 0 0 1-9-9V32a9 9 0 0 1 9-9z'/%3E%3Cpath d='M67 23v20h20'/%3E%3Ccircle cx='52' cy='65' r='13'/%3E%3Cpath d='M52 52v26M39 65h26'/%3E%3Cpath d='M45 79l-4 12 11-6 11 6-4-12'/%3E%3C/g%3E%3C/svg%3E");
}

/* 02 — passport / ID */
.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:nth-child(2)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='22' y='24' width='76' height='72' rx='10'/%3E%3Ccircle cx='52' cy='52' r='10'/%3E%3Cpath d='M67 48h18M67 58h18M36 77c4-9 11-13 20-13s16 4 20 13'/%3E%3C/g%3E%3C/svg%3E");
}

/* 03 — route / document path */
.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:nth-child(3)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='28' cy='83' r='6'/%3E%3Ccircle cx='90' cy='34' r='6'/%3E%3Cpath d='M34 80c12-10 18-17 29-23 10-6 16-10 21-18' stroke-dasharray='5 6'/%3E%3Cpath d='M73 28h21v21'/%3E%3Cpath d='M94 28L74 48'/%3E%3C/g%3E%3C/svg%3E");
}

/* 04 — sea service / wave */
.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:nth-child(4)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M15 40c8 0 8-5 16-5s8 5 16 5 8-5 16-5 8 5 16 5 8-5 16-5 8 5 16 5'/%3E%3Cpath d='M15 56c8 0 8-5 16-5s8 5 16 5 8-5 16-5 8 5 16 5 8-5 16-5 8 5 16 5'/%3E%3Cpath d='M15 72c8 0 8-5 16-5s8 5 16 5 8-5 16-5 8 5 16 5 8-5 16-5 8 5 16 5'/%3E%3Cpath d='M15 88c8 0 8-5 16-5s8 5 16 5 8-5 16-5 8 5 16 5 8-5 16-5 8 5 16 5'/%3E%3C/g%3E%3C/svg%3E");
}

/* 05 — training / badge */
.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:nth-child(5)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='60' cy='49' r='22'/%3E%3Cpath d='M60 36l4 8 9 1-6 6 2 9-9-5-9 5 2-9-6-6 9-1 4-8z'/%3E%3Cpath d='M49 71l-7 20 18-10 18 10-7-20'/%3E%3C/g%3E%3C/svg%3E");
}

/* 06 — supporting docs / stacked papers */
.sl15-main .sl15-prepared .sl15-info-grid .sl15-info-card:nth-child(6)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%230084D1' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='28' y='24' width='46' height='58' rx='6'/%3E%3Crect x='46' y='38' width='46' height='58' rx='6'/%3E%3Cpath d='M39 39h18M39 49h24M39 59h18'/%3E%3Cpath d='M57 53h18M57 63h24M57 73h18'/%3E%3C/g%3E%3C/svg%3E");
}


/* ==========================================================
   SERVICE SCOPE — SUBTLE FADED MARITIME ART INSIDE CARDS
   Similar visual treatment to services mega menu cards
   ========================================================== */

.sl15-main .sl15-scope-grid .sl15-scope-card{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
  background:linear-gradient(180deg, rgba(255,255,255,.045) 0%, rgba(255,255,255,.030) 100%) !important;
}

.sl15-main .sl15-scope-grid .sl15-scope-card > *{
  position:relative;
  z-index:2;
}

.sl15-main .sl15-scope-grid .sl15-scope-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 82% 24%, rgba(72,167,225,.12) 0%, rgba(72,167,225,.05) 16%, rgba(72,167,225,0) 38%);
  z-index:0;
  pointer-events:none;
}

.sl15-main .sl15-scope-grid .sl15-scope-card::after{
  content:"";
  position:absolute;
  right:-14px;
  bottom:-14px;
  width:180px;
  height:180px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  opacity:.11;
  filter:grayscale(100%);
  z-index:1;
  pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
}

.sl15-main .sl15-scope-grid .sl15-scope-card:hover::after{
  opacity:.15;
  transform:scale(1.03);
}

/* Card 1 — Certification Guidance */
.sl15-main .sl15-scope-grid .sl15-scope-card:nth-child(1)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%235eb8f0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M42 74h62l30 30v58a12 12 0 0 1-12 12H42a12 12 0 0 1-12-12V86a12 12 0 0 1 12-12z'/%3E%3Cpath d='M104 74v30h30'/%3E%3Ccircle cx='83' cy='124' r='21'/%3E%3Cpath d='M83 108v32M67 124h32'/%3E%3Cpath d='M72 145l-6 18 17-9 17 9-6-18'/%3E%3Cpath d='M126 44c10 10 29 10 39 0 10 10 29 10 39 0v49c0 33-22 58-58 72-36-14-58-39-58-72V44c10 10 29 10 38 0z' opacity='.7'/%3E%3Cpath d='M131 93l11 11 21-24' opacity='.7'/%3E%3C/g%3E%3C/svg%3E");
}

/* Card 2 — Document Support */
.sl15-main .sl15-scope-grid .sl15-scope-card:nth-child(2)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%235eb8f0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='48' y='58' width='64' height='84' rx='10'/%3E%3Cpath d='M68 82h24M68 96h38M68 110h32'/%3E%3Crect x='86' y='78' width='76' height='92' rx='10' opacity='.75'/%3E%3Cpath d='M106 104h24M106 118h34M106 132h28'/%3E%3Ccircle cx='168' cy='66' r='26' opacity='.75'/%3E%3Cpath d='M168 54v24M156 66h24' opacity='.75'/%3E%3C/g%3E%3C/svg%3E");
}

/* Card 3 — Application Coordination */
.sl15-main .sl15-scope-grid .sl15-scope-card:nth-child(3)::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%235eb8f0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='64' cy='147' r='10'/%3E%3Ccircle cx='118' cy='102' r='10'/%3E%3Ccircle cx='172' cy='58' r='10'/%3E%3Cpath d='M73 141c11-9 21-18 36-29 15-11 25-20 55-46' stroke-dasharray='6 7'/%3E%3Cpath d='M152 52h22v22'/%3E%3Cpath d='M174 52l-26 26'/%3E%3Cpath d='M46 60c10-10 27-10 37 0 10 10 27 10 37 0 10 10 27 10 37 0 10 10 27 10 37 0' opacity='.55'/%3E%3Cpath d='M38 175c13 0 13-7 26-7s13 7 26 7 13-7 26-7 13 7 26 7 13-7 26-7 13 7 26 7' opacity='.55'/%3E%3C/g%3E%3C/svg%3E");
}

/* keep text crisp on dark cards */
.sl15-main .sl15-scope-grid .sl15-scope-card h3{
  position:relative;
  z-index:2;
}

.sl15-main .sl15-scope-grid .sl15-scope-card .sl15-scope-list,
.sl15-main .sl15-scope-grid .sl15-scope-card .sl15-scope-label,
.sl15-main .sl15-scope-grid .sl15-scope-card .sl15-scope-icon{
  position:relative;
  z-index:2;
}


/* ==========================================================
   HERO — REMOVE WAVE / TEXTURE LINES ONLY
   Keep image, gradient, text and buttons unchanged
   ========================================================== */

.sl15-main .sl15-hero > .sl15-dark-texture{
  display:none !important;
  opacity:0 !important;
  background:none !important;
}