*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:"Times New Roman", Times, serif;
}
    :root {
      --red: #8B1A1A;
      --red-dark: #6e1414;
      --black: #000;
      --white: #ffffff;
      --gray-bg: #f4f6f8;
      --text: #000;
      --text-light: #000;
      --border: #e0e0e0;
      --primary-color: #7b121e;
      --primary-dark: #5a0d16;
      --text-color: #595959;
      --heading-color: #000b1c;
      --bg-light: #f9f9ff;
      --footer-bg: #000b1c;
      --border-color: #e8e8e8;
    }
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: 'Open Sans', sans-serif; color: var(--text); background: #fff; cursor: none; }
    a { text-decoration: none; color: inherit; }

    /* TOP BAR */
    .topbar { background: #000; color: #fff; border-bottom: 1px solid #000; padding: 10px 0; font-size: 13px; }
    .topbar-inner { max-width: 1100px; margin: auto; padding: 0 15px; display: flex; justify-content: space-between; align-items: center; }
    .topbar-left { display: flex; gap: 30px; align-items: center; }
    .topbar-left a { color: #fff; display: flex; align-items: center; gap: 7px; font-weight: 400; margin-left: 20px; }
    .topbar-left a:hover { color: #fff; }
    .topbar-left i { color: var(--red); }
    .btn-start { background: var(--red); color: #fff; font-family: 'Montserrat',sans-serif; font-weight: 700; font-size: 13px; letter-spacing: 0; padding: 10px 30px; border-radius: 10px; text-transform: uppercase; transition: background .2s; display: inline-block; }
    .btn-start:hover { background: var(--red-dark); }
   .logo img {
       height: 80px;
       max-width: 150px;
       object-fit: contain;
       margin-right: auto;
        }

 /* ===== HEADER / NAV ===== */
    header {
      position: absolute; /* This moves it ON TOP of the hero image */
      left: 0;
      right: 0;
      width: 100%;
      z-index: 1000;
      background: transparent; /* Removes white background */
      box-shadow: none;
      padding-top: 20px;
    }
    
    .navbar,
    .nav-inner {
      display: flex;
      color: #000000;
      justify-content: space-between; /* Keeps logo left, links right */
      align-items: center;
      height: 80px;
      max-width: 1200px;
      margin: auto;
      padding: 0 15px;
    }

    .nav-links,
    nav > ul { 
      list-style: none;
      display: flex; 
      gap: 25px;
      align-items: center;
      margin: 0; 
      padding: 0;
    }
    .nav-item,
    nav ul li {
      position: relative;
      display: flex;
      align-items: center;
    }
    .nav-links a,
    nav ul li a {
      position: relative;
      font-size: 14px;
      font-weight: 600;
      color: #fff;
      text-transform: uppercase;
      text-shadow: 0 2px 4px rgba(0,0,0,0.3);
      padding-bottom: 4px;
      transition: opacity .2s ease;
    }
    .nav-links a:not(.dropdown-toggle)::after,
    nav ul li a:not(.dropdown-toggle)::after {
      content: '';
      position: absolute;
      left: 0;
      bottom: -2px;
      width: 100%;
      height: 2px;
      background: var(--red, #8B1A1A);
      transform: scaleX(0);
      transform-origin: right;
      transition: transform .3s ease;
    }
    .nav-links a:not(.dropdown-toggle):hover::after,
    nav ul li a:not(.dropdown-toggle):hover::after {
      transform: scaleX(1);
      transform-origin: left;
    }
    .nav-links a:hover,
    nav ul li a:hover {
      color: #fff !important;
      opacity: .92;
    }
    .dropdown-toggle {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      cursor: pointer;
      font-size: 13px;
      font-weight: 500;
      color: #fff;
      text-transform: uppercase;
      text-shadow: 0 2px 4px rgba(0,0,0,0.3);
      transition: all 0.3s ease;
    }

    .dropdown-toggle {
      color: #fff;
    }

    .dropdown-toggle:hover {
      color: #fff;
    }

    .dropdown-toggle::after {
      content: '\25BE';
      font-size: 10px;
      transition: transform 0.3s ease;
    }

    .dropdown-menu {
      position: absolute;
      top: 100%;
      left: 0;
      background: #1a1a1a;
      border: 1px solid #333;
      border-radius: 5px;
      min-width: 250px;
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-10px);
      transition: all 0.3s ease;
      z-index: 1001;
      margin-top: 10px;
    }

    .nav-item:hover .dropdown-menu {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }

    .nav-item:hover .dropdown-toggle::after { transform: rotate(180deg); }
    .dropdown-menu a {
      display: block;
      padding: 15px 20px;
      color: #fff;
      text-decoration: none;
      font-size: 12px;
      text-transform: uppercase;
      transition: all 0.3s ease;
      border-left: 3px solid transparent;
    }

 .dropdown-menu a:hover {
    background: #2a2a2a;
    color: #fff !important;
    border-left-color: #fff;
    text-shadow: none;
}

    .dropdown-menu a:first-child {
      border-radius: 4px 4px 0 0;
    }

    .dropdown-menu a:last-child {
      border-radius: 0 0 4px 4px;
    }

    /* Prevent dropdown <ul> from inheriting navbar flex */
    .dropdown-menu ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: block;
    }
    .dropdown-menu ul li {
      display: block;
    }

    .dropdown-menu .submenu-toggle {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .dropdown-menu .submenu-toggle::after {
      content: '▶';
      font-size: 10px;
      margin-left: auto;
      transition: transform 0.3s ease;
    }

    .submenu {
      position: absolute;      .dropdown-menu .submenu-toggle::after {
        content: '▶';
        font-size: 10px;
        margin-left: auto;
        transition: transform 0.3s ease;
      }      .dropdown-menu .submenu-toggle::after {
        content: '▶';
        font-size: 10px;
        margin-left: auto;
        transition: transform 0.3s ease;
      }      .dropdown-menu .submenu-toggle::after {
        content: '▶';
        font-size: 10px;
        margin-left: auto;
        transition: transform 0.3s ease;
      }      .dropdown-menu .submenu-toggle::after {
        content: '▶';
        font-size: 10px;
        margin-left: auto;
        transition: transform 0.3s ease;
      }      .dropdown-menu .submenu-toggle::after {
        content: '▶';
        font-size: 10px;
        margin-left: auto;
        transition: transform 0.3s ease;
      }      .dropdown-menu .submenu-toggle::after {
        content: '▶';
        font-size: 10px;
        margin-left: auto;
        transition: transform 0.3s ease;
      }
      top: 0;
      left: 100%;
      background: #1a1a1a;
      border: 1px solid #333;
      border-radius: 5px;
      min-width: 250px;
      box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
      opacity: 0;
      visibility: hidden;
      transform: translateX(-10px);
      transition: all 0.3s ease;
      z-index: 1002;
      margin-left: 5px;
    }

    .dropdown-menu li {
      position: relative;
      list-style: none;
    }

    .dropdown-menu li:hover .submenu {
      opacity: 1;
      visibility: visible;
      transform: translateX(0);
    }

    .dropdown-menu li:hover .submenu-toggle::after {
      transform: rotate(90deg);
    }

    .submenu a {
      display: block;
      padding: 15px 20px;
      color: #fff;
      text-decoration: none;
      font-size: 12px;
      text-transform: uppercase;
      transition: all 0.3s ease;
      border-left: 3px solid transparent;
    }

    .submenu a:hover {
      background: #2a2a2a;
      color: var(--red);
      border-left-color: var(--red);
      padding-left: 25px;
    }

    body {
      cursor: auto;
    }

    .custom-cursor,
    .custom-cursor-follower {
      position: fixed;
      top: 0;
      left: 0;
      width: 14px;
      height: 14px;
      border-radius: 50%;
      pointer-events: none;
      transform: translate(-50%, -50%);
      mix-blend-mode: difference;
      transition: transform 0.15s ease, background 0.15s ease, opacity 0.25s ease, width 0.15s ease, height 0.15s ease;
      z-index: 99999;
      opacity: 0.95;
    }

    .custom-cursor {
      background: rgba(255, 255, 255, 0.95);
      box-shadow: 0 0 16px rgba(255, 255, 255, 0.9), 0 0 30px rgba(255, 150, 150, 0.35);
      width: 12px;
      height: 12px;
      border: 1px solid rgba(255, 255, 255, 0.8);
    }

    .custom-cursor-follower {
      width: 44px;
      height: 44px;
      background: rgba(255, 100, 100, 0.08);
      border: 1px solid rgba(255, 100, 100, 0.4);
      box-shadow: 0 0 35px rgba(255, 85, 85, 0.35), inset 0 0 8px rgba(255, 255, 255, 0.35);
      backdrop-filter: blur(1px);
    }

    .custom-cursor.cursor-active {
      transform: translate(-50%, -50%) scale(1.8);
      background: rgba(255, 255, 255, 1);
      box-shadow: 0 0 24px rgba(255, 255, 255, 1), 0 0 32px rgba(255, 175, 175, 0.6);
    }

    .custom-cursor-follower.cursor-active {
      transform: translate(-50%, -50%) scale(1.05);
      background: rgba(255, 100, 100, 0.16);
      box-shadow: 0 0 40px rgba(255, 100, 100, 0.35), inset 0 0 10px rgba(255, 255, 255, 0.25);
    }

    @media (hover: none) {
      body { cursor: auto; }
      .custom-cursor,
      .custom-cursor-follower { display: none; }
    }

    .submenu a:first-child {
      border-radius: 4px 4px 0 0;
    }

    .submenu a:last-child {
      border-radius: 0 0 4px 4px;
    }

    .logo img { max-width: 170px; max-height: 130px; object-fit: contain; margin-right: auto; }

    .nav-links a:hover { color: var(--red); }


/* Fix for Hero Section */
.hero {
    margin-top: 0; /* Ensures hero starts right after the black navbar */
}

    .social-sidebar {
      position: fixed;
      right: 20px;
      top: 50%;
      transform: translateY(-50%);
      display: flex;
      flex-direction: column;
      gap: 15px;
      z-index: 999;
    }

    .social-sidebar a {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      font-size: 20px;
      transition: all 0.3s ease;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    }

    .social-sidebar .s-fb {
      background-color: #3b5998;
    }

    .social-sidebar .s-fb:hover {
      background-color: #2d4373;
      transform: scale(1.1);
      box-shadow: 0 6px 16px rgba(59, 89, 152, 0.4);
    }

    .social-sidebar .s-ig {
      background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    }

    .social-sidebar .s-ig:hover {
      transform: scale(1.1);
      box-shadow: 0 6px 16px rgba(226, 51, 124, 0.4);
    }

    .social-sidebar .s-li {
      background-color: #0077b5;
    }

    .social-sidebar .s-li:hover {
      background-color: #005a8f;
      transform: scale(1.1);
      box-shadow: 0 6px 16px rgba(0, 119, 181, 0.4);
    }

    .social-sidebar .s-yt {
      background-color: #ff0000;
    }

    .social-sidebar .s-yt:hover {
      background-color: #cc0000;
      transform: scale(1.1);
      box-shadow: 0 6px 16px rgba(255, 0, 0, 0.4);
    }
    
    .process-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:35px;
    margin-top:60px;
}

.method-card{
    text-align:center;
    padding:35px 30px;
    border-radius:18px;
}

.process-icon{
    font-size:48px;
    margin-bottom:20px;
}
.process-section .section-title h2{
    color:#fff !important;
}

.process-section .section-title p{
    color:rgba(255,255,255,.85) !important;
}

.process-section{
    position:relative;
    overflow:hidden;
    padding:100px 0;
    background:url("images/process.png") center center/cover no-repeat fixed;
}

.process-section::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(5,10,20,.80),
        rgba(15,20,35,.85)
    );
}

.process-section .container{
    position:relative;
    z-index:2;
}
.process-section::before{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.70);   /* Darkness */
    z-index:1;
}

.process-section .container{
    position:relative;
    z-index:2;
}
.services{
    padding:100px 0;
    background:#f5f9ff;
}

.section-title{
    text-align:center;
    max-width:760px;
    margin:auto;
    margin-bottom:70px;
}

.section-title span{
    color:#7b121e;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
}

.section-title h2{
    margin:15px 0;
    font-size:45px;
    font-weight:700;
    color:#0b2545;
}

.section-title p{
    color:#666;
    line-height:1.8;
}

/*========================*/

.bento-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    grid-auto-rows:250px;
    gap:25px;
}

/* Large Card */

.large{
    grid-column:span 2;
    grid-row:span 2;
}

/* Wide Card */

.wide{
    grid-column:span 2;
}

/*========================*/

.service-card{

    position:relative;
    overflow:hidden;

    background:#fff;
    border-radius:28px;

    padding:35px;

    transition:.45s;

    border:1px solid rgba(0,0,0,.05);

    display:flex;
    flex-direction:column;
    justify-content:flex-end;

    box-shadow:0 15px 40px rgba(0,0,0,.05);
}

/* Gradient Glow */

.service-card::before{

    content:"";

    position:absolute;

    top:-120px;
    right:-120px;

    width:220px;
    height:220px;

    border-radius:50%;

    background:linear-gradient(135deg,#7b121e);

    opacity:.08;

    transition:.5s;
}

/* Hover */

.service-card:hover{

    transform:translateY(-12px);

    box-shadow:0 30px 60px rgba(0,98,255,.18);
}

.service-card:hover::before{

    transform:scale(1.8);

    opacity:.15;
}

/* Icon */

.icon{

    width:70px;
    height:70px;

    border-radius:20px;

    background:linear-gradient(135deg,#7b121e,#7b121e);

    color:#fff;

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

    font-size:28px;

    margin-bottom:30px;

    transition:.4s;
}

.service-card:hover .icon{

    transform:rotate(-10deg) scale(1.1);
}

/* Heading */

.service-card h3{

    font-size:28px;

    color:#082032;

    margin-bottom:15px;
}

.service-card p{

    color:#666;

    line-height:1.7;
}

.service-card a{

    margin-top:25px;

    color:#7b121e;

    font-weight:600;

    text-decoration:none;
}

.service-card a i{

    margin-left:8px;

    transition:.3s;
}

.service-card:hover a i{

    transform:translateX(6px);
}
.services{
    position: relative;
    padding: 120px 0;
    overflow: hidden;

    /* Background Image */
    background: url("images/services-bg.jpg") center center/cover no-repeat;
}

/* Dark Overlay */
.services::before{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        rgba(8, 15, 30, 0.80),
        rgba(8, 15, 30, 0.80)
    );
    z-index: 1;
}

/* Keep content above overlay */
.services .container{
    position: relative;
    z-index: 2;
}

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

.why-section{
    padding:120px 0;
    background:#f8fbff;
    position:relative;
    overflow:hidden;
}

/* Background Shapes */

.why-section::before{
    content:"";
    width:350px;
    height:350px;
    background:rgba(0,102,255,.07);
    border-radius:50%;
    position:absolute;
    top:-150px;
    right:-120px;
    filter:blur(30px);
}

.why-section::after{
    content:"";
    width:280px;
    height:280px;
    background:rgba(0,180,255,.08);
    border-radius:50%;
    position:absolute;
    bottom:-100px;
    left:-100px;
    filter:blur(30px);
}

/*=============================
      Section Heading
==============================*/

.section-title{
    text-align:center;
    max-width:750px;
    margin:0 auto 70px;
}

.sub-title{
    display:inline-block;
    background:#eaf3ff;
    color:#7b121e;
    padding:8px 20px;
    border-radius:50px;
    font-size:14px;
    font-weight:600;
    letter-spacing:1px;
    margin-bottom:20px;
}

.section-title h2{
    font-size:48px;
    color:#111;
    line-height:1.25;
    margin-bottom:20px;
}

.section-title h2 span{
    color:#7b121e;
}

.section-title p{
    color:#666;
    line-height:1.8;
    font-size:17px;
}

/*=============================
        Grid
==============================*/

.why-wrapper{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

/*=============================
        Left Image
==============================*/

.why-image{
    position: relative;
    height: 100%;
}

.why-image img{
    width: 100%;
    height: clamp(380px, 50vw, 650px);
    object-fit: cover;
    border-radius: 30px;
    display: block;
}

/*=============================
      Floating Cards
==============================*/

.experience-card{
    position:absolute;
    bottom:25px;
    left:25px;

    background:#fff;
    padding:22px 28px;

    border-radius:20px;

    box-shadow:0 20px 45px rgba(0,0,0,.12);

    animation:float 4s ease-in-out infinite;
}

.experience-card h3{
    font-size:38px;
    color:#7b121e;
    margin-bottom:5px;
}

.experience-card span{
    color:#555;
    font-weight:500;
}

.clients-card{

    position:absolute;

    top:30px;
    right:-25px;

    background:#fff;

    padding:18px 25px;

    border-radius:18px;

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

    box-shadow:0 20px 45px rgba(0,0,0,.12);

    animation:float 5s ease-in-out infinite;
}

.clients-card i{

    width:55px;
    height:55px;

    background:#7b121e;
    color:#fff;

    border-radius:50%;

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

    font-size:22px;
}

.clients-card h4{

    color:#111;
    font-size:24px;
}

.clients-card p{

    color:#666;
    font-size:14px;
}

/*=============================
      Right Content
==============================*/

.why-content{
    display:flex;
    flex-direction:column;
    gap:22px;
}

/*=============================
       Feature Box
==============================*/

.feature-box{

    background:#fff;

    border-radius:22px;

    padding:26px;

    display:flex;
    gap:22px;

    transition:.4s;

    box-shadow:0 12px 35px rgba(0,0,0,.06);

    border:1px solid transparent;
}

.feature-box:hover{

    transform:translateY(-8px);

    border-color:#7b121e;

    box-shadow:0 20px 45px rgba(123, 18, 30, 0.15);
}

/*=============================
      Feature Icon
==============================*/

.feature-icon{

    width:70px;
    height:70px;

    min-width:70px;

    border-radius:18px;

    background:linear-gradient(135deg,#7b121e,#a5192a);

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

    color:#fff;

    font-size:26px;

    transition:.4s;
}

.feature-box:hover .feature-icon{

    transform:rotate(-8deg) scale(1.08);
}

/*=============================
       Text
==============================*/

.feature-text h4{

    font-size:22px;

    margin-bottom:10px;

    color:#111;
}

.feature-text p{

    color:#666;

    line-height:1.8;
}

/*=============================
        Button
==============================*/

.why-btn{

    margin-top:15px;

    display:inline-flex;

    align-items:center;

    gap:12px;

    width:max-content;

    padding:16px 34px;

    border-radius:50px;

    background:#7b121e;

    color:#fff;

    text-decoration:none;

    font-weight:600;

    transition:.4s;
}

.why-btn:hover{

    background:#7b121e;

    gap:20px;

    transform:translateY(-3px);
}

/*=============================
        Animation
==============================*/

@keyframes float{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0px);

}

}

/*=============================
      Responsive
==============================*/

@media(max-width:992px){

.why-wrapper{

grid-template-columns:1fr;

gap:50px;

}

.clients-card{

right:20px;

}

.section-title h2{

font-size:38px;

}

}

@media(max-width:768px){

.why-section{

padding:80px 0;

}

.section-title h2{

font-size:30px;

}

.feature-box{

flex-direction:column;

text-align:center;

align-items:center;

}

.feature-icon{

margin-bottom:10px;

}

.clients-card{

position:relative;

top:auto;

right:auto;

margin-top:20px;

width:max-content;

}

.experience-card{

left:15px;
bottom:15px;

padding:18px;

}

.experience-card h3{

font-size:30px;

}

}

@media(max-width:576px){

.why-btn{

width:100%;
justify-content:center;

}

.clients-card{

width:100%;

justify-content:center;

}

}
    /* Layout container to constrain section widths */
    .container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

   .hero { position: relative; min-height: 530px; display: flex; align-items: center; justify-content: center; font-family: 'Times New Roman', Times, serif; text-align: center; background: url('https://4kwallpapers.com/images/wallpapers/chicago-city-2880x1800-18599.jpg') center/cover no-repeat; padding: 80px 20px; }
    .hero-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.60); }
    .hero-content { position: relative; z-index: 1; max-width: 820px; }
    .hero-content h1 { font-family: 'Times New Roman', Times, serif; font-size: 45px; font-weight: 700; color: #fff; line-height: 1.25; margin-bottom: 18px; }
    .hero-content p { font-size: 16px; color: rgba(255,255,255,.88); max-width: 620px; margin: 0 auto 32px; line-height: 1.7; }
    .btn-red { background: var(--red); color: #fff; font-family: 'Times New Roman', Times, serif; font-weight: 700; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; padding: 15px 44px; border-radius: 4px; display: inline-block; transition: background .2s, transform .15s; }
    .btn-red:hover { background: var(--red-dark); transform: translateY(-2px); }

    /* ===== HERO IMAGE ROLLER ===== */
    .page-banner {
      position: relative;
      min-height: 640px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      color: #fff;
      text-align: center;
      isolation: isolate;
    }
    .hero-slide {
      position: absolute;
      inset: 0;
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      opacity: 0;
      transform: scale(1.12);
      transition: opacity 1.4s ease, transform 6.5s linear;
      z-index: 0;
    }
    .hero-slide.active {
      opacity: 1;
      transform: scale(1);
      z-index: 1;
    }
    .hero-slide::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0,6,20,0.72) 0%, rgba(0,6,20,0.58) 45%, rgba(0,6,20,0.8) 100%);
    }
    .page-banner .container {
      position: relative;
      z-index: 2;
      max-width: 1000px;
      margin: 0 auto;
      padding: 120px 20px 90px;
    }
    .hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(255,255,255,0.1);
      border: 1px solid rgba(255,255,255,0.28);
      backdrop-filter: blur(6px);
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 1.6px;
      text-transform: uppercase;
      padding: 8px 18px;
      border-radius: 999px;
      margin-bottom: 24px;
      opacity: 0;
    }
    .hero-eyebrow i { color: #ffd27a; font-size: 11px; }
    .page-banner h1 {
      font-family: 'Times New Roman', Times, serif;
      font-size: clamp(2.4rem,5vw,4.6rem);
      font-weight: 800;
      letter-spacing: -0.02em;
      margin-bottom: 18px;
      color: #fff;
      opacity: 0;
    }
    .page-banner p {
      font-size: clamp(1rem,1.1vw,1.4rem);
      line-height: 1.65;
      max-width: 800px;
      margin: 0 auto 34px;
      color: rgba(255,255,255,0.92);
      opacity: 0;
    }
    .hero-copy.is-active .hero-eyebrow { animation: heroRise .7s ease forwards; }
    .hero-copy.is-active h1 { animation: heroRise .8s ease .12s forwards; }
    .hero-copy.is-active p { animation: heroRise .8s ease .24s forwards; }
    .hero-copy.is-active .hero-cta-row { animation: heroRise .8s ease .36s forwards; }
    .hero-cta-row { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; opacity: 0; }
    @keyframes heroRise {
      from { opacity: 0; transform: translateY(26px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .btn-ghost {
      display: inline-block;
      font-family: 'Times New Roman', Times, serif;
      font-weight: 700;
      font-size: 14px;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      padding: 15px 44px;
      border-radius: 4px;
      border: 1px solid rgba(255,255,255,0.6);
      color: #fff;
      transition: background .25s ease, transform .2s ease, border-color .25s ease;
    }
    .btn-ghost:hover { background: rgba(255,255,255,0.14); border-color: #fff; transform: translateY(-2px); }

    /* Slider controls */
    .hero-dots {
      position: absolute;
      z-index: 3;
      bottom: 30px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 12px;
    }
    .hero-dot {
      width: 34px;
      height: 4px;
      border-radius: 3px;
      background: rgba(255,255,255,0.35);
      border: none;
      padding: 0;
      cursor: pointer;
      overflow: hidden;
      position: relative;
      transition: background .25s ease;
    }
    .hero-dot:hover { background: rgba(255,255,255,0.6); }
    .hero-dot span {
      position: absolute;
      inset: 0;
      background: #fff;
      transform-origin: left;
      transform: scaleX(0);
    }
    .hero-dot.active span { animation: heroDotFill 3s linear forwards; }
    @keyframes heroDotFill { from { transform: scaleX(0); } to { transform: scaleX(1); } }

    .hero-arrow {
      position: absolute;
      z-index: 3;
      top: 50%;
      transform: translateY(-50%);
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background: rgba(255,255,255,0.1);
      border: 1px solid rgba(255,255,255,0.35);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      font-size: 15px;
      transition: background .25s ease, transform .25s ease, border-color .25s ease;
    }
    .hero-arrow:hover { background: rgba(255,255,255,0.25); border-color: #fff; transform: translateY(-50%) scale(1.08); }
    .hero-arrow.prev { left: 26px; }
    .hero-arrow.next { right: 26px; }
    @media (max-width: 640px) {
      .hero-arrow { width: 38px; height: 38px; font-size: 13px; }
      .hero-arrow.prev { left: 12px; }
      .hero-arrow.next { right: 12px; }
      .page-banner { min-height: 560px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .hero-slide, .hero-copy.is-active *, .hero-dot span { animation: none !important; transition: opacity .3s ease !important; }
      .hero-slide.active { transform: none; }
      .hero-copy.is-active .hero-eyebrow,
      .hero-copy.is-active h1,
      .hero-copy.is-active p,
      .hero-copy.is-active .hero-cta-row { opacity: 1; }
    }

    .section-padding { padding: 80px 0; }
    .text-center { text-align: center; }
    .section-title { margin-bottom: 60px; }
    /* Clickable card styling and animation */
    .clickable-card { cursor: pointer; transition: transform .28s ease, box-shadow .28s ease; }
    .clickable-card:hover { transform: translateY(-8px); box-shadow: 0 18px 40px rgba(0,0,0,0.12); }
    .feature-card { transition: transform .3s ease, box-shadow .3s ease; }
    .feature-card:hover { transform: translateY(-8px); box-shadow: 0 20px 44px rgba(0,0,0,0.16) !important; }
    .feature-card:hover > div:first-child { transform: translateX(-50%) scale(1.1) rotate(-6deg); }
    .feature-card > div:first-child { transition: transform .3s ease; }
    .method-card { transition: transform .3s ease, box-shadow .3s ease, background .3s ease; }
    .method-card:hover { transform: translateY(-6px); box-shadow: 0 16px 36px rgba(0,0,0,0.1); background: #fff !important; }
    .method-card i { transition: transform .3s ease; }
    .method-card:hover i { transform: scale(1.15) rotate(-4deg); }
    .faq-question { transition: background .2s ease, padding-left .2s ease; }
    .faq-question:hover { background: #f9f9ff !important; padding-left: 26px; }
    .faq-question i { transition: transform .3s ease; }
    .cta-card { transition: transform .3s ease, box-shadow .3s ease; }
    .cta-card:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(0,0,0,0.22); }
    .cta-btn { transition: transform .2s ease, box-shadow .2s ease; }
    .cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0,0,0,0.25); }
    .value-card { transition: transform .3s ease; }
    .value-card:hover { transform: translateY(-5px); }
    .value-card i { transition: transform .3s ease; }
    .value-card:hover i { transform: scale(1.15); }

    .premium-grid { display: grid; grid-template-columns: repeat(4, minmax(260px, 1fr)); gap: 30px; margin-top: 40px; }
    .premium-card { background: #fff; border-radius: 24px; overflow: hidden; border: 1px solid rgba(0,0,0,0.08); box-shadow: 0 24px 60px rgba(0,0,0,0.08); transition: transform .3s ease, box-shadow .3s ease; display: flex; flex-direction: column; min-height: 100%; position: relative; }
    .premium-card:hover { transform: translateY(-8px); box-shadow: 0 30px 70px rgba(0,0,0,0.12); }
    .premium-card-media { position: relative; overflow: hidden; }
    .premium-card-media img { width: 100%; height: 150px; object-fit: cover; transition: transform .3s ease; }
    .premium-card:hover .premium-card-media img { transform: scale(1.04); }
    .premium-card-badge { position: absolute; top: 16px; left: 16px; background: #7b121e; color: #fff; padding: 8px 14px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
    .premium-card-price { position: absolute; bottom: 16px; right: 16px; background: rgba(123,18,30,.95); color: #fff; padding: 11px 14px; border-radius: 12px; font-weight: 700; font-size: 14px; white-space: nowrap; }
    .premium-card-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 14px; flex: 1; }
    .premium-card-body h3 {
        font-size: 17px;
        line-height: 1.35;
        margin: 0;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        overflow: hidden;
    }
    .premium-card-body p { color: #505050; font-size: 13px; line-height: 1.55; margin: 0; max-height: 3.4em; overflow: hidden; }
    .premium-card-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
    .premium-card-meta .avatars { display: flex; gap: -10px; }
    .premium-card-meta .avatars img { width: 34px; height: 34px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,0.08); }
    .premium-card-meta .stats { display: flex; gap: 10px; color: #555; font-size: 13px; flex-wrap: wrap; }
    .premium-card-meta .stats span { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; background: #f4f4f7; border-radius: 999px; }
    .premium-card-meta .stats i { color: #7b121e; font-size: 12px; }
    .premium-card-rating { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #333; }
    .premium-card-rating i { color: #f4b942; }
    .premium-card-rating small { color: #7b121e; font-weight: 700; }
    .premium-card-link { color: #7b121e; font-weight: 700; font-size: 13px; font-family: 'Times New Roman', Times, serif; text-transform: uppercase; letter-spacing: .8px; display: inline-block; }
    .premium-card-footer { margin-top: auto; display: flex; flex-direction: column; gap: 16px; }
    .premium-card-footer .btn { width: 100%; padding: 16px 20px; font-size: 13px; border-radius: 14px; background: #7b121e; color: #fff; text-align: center; font-weight: 700; border: none; }
    .premium-card-footer .btn:hover { background: #5d0f1a; }
    
    .see-all-btn {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 10px;
}
    /* ===== ACCREDITATION LOGO SLIDER ===== */
    .logo-slider {
      overflow: hidden;
      position: relative;
      margin-top: 35px;
      padding: 26px 0;
      background: #ffffff;
      border-radius: 12px;
      border: 1px solid #e2e8f0;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
      -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
      mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
    }
    .logo-track {
      display: flex;
      align-items: center;
      gap: 65px;
      width: max-content;
      animation: logoScroll 24s linear infinite;
    }
    .logo-slider:hover .logo-track { animation-play-state: paused; }
    .logo-track .logo-item {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 85px;
      padding: 6px 16px;
      background: #ffffff;
      border-radius: 8px;
      transition: transform .25s ease;
    }
    .logo-track .logo-item:hover {
      transform: translateY(-4px) scale(1.05);
    }
    .logo-track .logo-item img {
      max-width: 155px;
      max-height: 75px;
      width: auto;
      height: auto;
      object-fit: contain;
      filter: grayscale(15%);
      opacity: 0.95;
      transition: filter .25s ease, opacity .25s ease, transform .25s ease;
    }
    .logo-track .logo-item:hover img {
      filter: grayscale(0%);
      opacity: 1;
    }
    .logo-track .logo-item.logo-wide img,
    .logo-track .logo-item img.img-wide {
      max-width: 260px !important;
      max-height: 82px !important;
      height: 70px !important;
      width: auto !important;
    }
    @keyframes logoScroll {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }
    @media (prefers-reduced-motion: reduce) {
      .logo-track { animation: none; }
      .logo-slider { overflow-x: auto; }
    }

    /* PAGE LAYOUT */
    .page-wrap { max-width: 1100px; margin: 50px auto; padding: 0 24px; display: grid; grid-template-columns: 1fr 300px; gap: 30px; align-items: start; }

    /* SECTIONS */
    .section { background: #fff; border-radius: 8px; box-shadow: 0 2px 14px rgba(0,0,0,0.07); padding: 28px 32px; margin-bottom: 24px; }
    .section h2 { font-family: 'Times New Roman', Times, serif; font-size: 1.18rem; font-weight: 800; color: var(--black); margin-bottom: 20px; padding-bottom: 11px; border-bottom: 3px solid var(--red); display: inline-block; }
    .section p { color: var(--text-light); line-height: 1.8; font-size: 14.5px; margin-bottom: 12px; }
    .section p:last-child { margin-bottom: 0; }

    .bullet-list { list-style: none; padding: 0; }
    .bullet-list li { padding: 9px 0 9px 26px; border-bottom: 1px solid #f3f3f3; font-size: 14.5px; color: var(--text); position: relative; line-height: 1.5; }
    .bullet-list li:last-child { border-bottom: none; }
    .bullet-list li::before { content: "✔"; position: absolute; left: 0; top: 10px; color: var(--red); font-size: 12px; }

    .features-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 14px; }
    .feature-card { background: #fdf5f5; border-left: 4px solid var(--red); border-radius: 6px; padding: 14px 16px; font-size: 14px; font-weight: 700; color: var(--black); font-family: 'Times New Roman', Times, serif; }

    .skills-grid { display: flex; flex-wrap: wrap; gap: 10px; }
    .skill-tag { background: #fdf5f5; color: var(--red); padding: 7px 16px; border-radius: 20px; font-size: 13.5px; font-weight: 600; border: 1px solid #f0c0c0; }

    /* FOOTER */
    footer { background: #000000; color: #fff; padding: 80px 0 30px; margin-top: 60px; }
    .footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 40px; max-width: 1100px; margin: 0 auto; padding: 0 15px; }
    .footer-col h3 { color: #fff; margin-bottom: 25px; font-size: 18px; }
    .footer-col ul li { margin-bottom: 15px; }
    .footer-col ul li a { color: #777; }
    .footer-col ul li a:hover { color: var(--red); }
    .copyright { max-width: 1100px; margin: 60px auto 0; border-top: 1px solid rgba(255,255,255,0.1); padding: 30px 15px 0; text-align: center; color: #777; font-size: 14px; }
    .home-footer { background: #000000; color: #fff; padding: 70px 0 20px; }
    .home-footer .footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; }
    .home-footer .footer-col h3 { margin-bottom: 18px; font-size: 32px; font-weight: 700; font-family: 'Times New Roman', Times, serif; color: #fff; }
    .home-footer .footer-col p,
    .home-footer .footer-col a,
    .home-footer .footer-col li { color: #ffffff; font-size: 16px; line-height: 1.6; }
    .home-footer .footer-col ul { list-style: none; margin: 0; padding: 0; }
    .home-footer .footer-col ul li { margin-bottom: 8px; padding: 0; }
    .home-footer .footer-col a:hover { color: #d6e4ff; }
    .footer-contact-link { display: block; margin-bottom: 6px; }
    .footer-social { display: flex; gap: 14px; margin-top: 10px; }
    .footer-social a { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.45); display: flex; align-items: center; justify-content: center; font-size: 17px; }
    .home-footer .copyright { margin-top: 35px; border-top: 1px solid rgba(255,255,255,0.16); padding-top: 18px; color: #ffffff; font-size: 15px; }

    .back-to-top {
      position: fixed;
      right: 24px;
      bottom: 24px;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: var(--red);
      color: #fff;
      border: none;
      display: grid;
      place-items: center;
      font-size: 18px;
      cursor: pointer;
      box-shadow: 0 12px 24px rgba(0,0,0,0.2);
      transition: transform 0.2s ease, opacity 0.2s ease;
      opacity: 0;
      visibility: hidden;
      z-index: 999;
    }
    .back-to-top.show {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }
    .back-to-top:hover {
      transform: translateY(-2px);
      background: var(--red-dark);
    }

    /* CAREER ROADMAP STYLES */
    .roadmap-section {
      background: linear-gradient(135deg, #f5f7fa 0%, #e8ecf0 100%);
      padding: 60px 0;
      margin: 40px 0;
    }
    .roadmap-container {
      max-width: 1000px;
      margin: 0 auto;
      padding: 0 20px;
    }
    .roadmap-header {
      text-align: center;
      margin-bottom: 50px;
    }
    .roadmap-header h2 {
      font-family: 'Times New Roman', Times, serif;
      font-size: 36px;
      font-weight: 800;
      color: var(--red);
      margin-bottom: 15px;
    }
    .roadmap-header p {
      font-size: 16px;
      color: #555;
      max-width: 600px;
      margin: 0 auto;
      line-height: 1.6;
    }
    .timeline {
      position: relative;
      padding: 20px 0;
    }
    .timeline::before {
      content: '';
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      width: 3px;
      height: 100%;
      background: linear-gradient(180deg, var(--red) 0%, var(--red) 100%);
    }
    .timeline-item {
      margin-bottom: 50px;
      position: relative;
    }
    .timeline-item:nth-child(odd) .timeline-content {
      margin-left: 0;
      margin-right: auto;
      width: 48%;
      text-align: right;
      padding-right: 40px;
    }
    .timeline-item:nth-child(even) .timeline-content {
      margin-left: auto;
      margin-right: 0;
      width: 48%;
      text-align: left;
      padding-left: 40px;
    }
    .timeline-marker {
      position: absolute;
      left: 50%;
      top: 0;
      transform: translateX(-50%);
      width: 40px;
      height: 40px;
      background: var(--red);
      border: 4px solid #fff;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      font-weight: bold;
      font-size: 16px;
      z-index: 10;
      box-shadow: 0 0 0 4px #fff, 0 4px 12px rgba(0,0,0,0.15);
    }
    .timeline-content {
      background: #fff;
      padding: 25px;
      border-radius: 8px;
      box-shadow: 0 4px 15px rgba(0,0,0,0.1);
      transition: all 0.3s ease;
    }
    .timeline-content:hover {
      box-shadow: 0 8px 25px rgba(139, 26, 26, 0.2);
      transform: translateY(-5px);
    }
    .timeline-content h3 {
      font-family: 'Times New Roman', Times, serif;
      font-size: 18px;
      font-weight: 700;
      color: var(--red);
      margin-bottom: 10px;
    }
    .timeline-content p {
      font-size: 14px;
      color: #555;
      line-height: 1.6;
      margin-bottom: 12px;
    }
    .timeline-content ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    .timeline-content ul li {
      font-size: 13px;
      color: #666;
      padding: 6px 0 6px 20px;
      position: relative;
    }
    .timeline-content ul li:before {
      content: '▸';
      position: absolute;
      left: 0;
      color: var(--red);
      font-weight: bold;
    }
    @media(max-width:768px) {
      .timeline::before {
        left: 15px;
      }
      .timeline-item:nth-child(odd) .timeline-content,
      .timeline-item:nth-child(even) .timeline-content {
        width: calc(100% - 60px);
        margin: 0;
        padding-left: 60px;
        text-align: left;
      }
      .timeline-marker {
        left: 15px;
      }
      .roadmap-header h2 {
        font-size: 28px;
      }
    }

    @media(max-width:1024px){ .page-wrap{ grid-template-columns:1fr; } .sidebar{ position:static; } .home-footer .footer-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } .advisors-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .topbar-inner{ padding:0 15px; } .nav-inner{ padding:0 15px; } .reviews-box{ padding:35px 20px; min-height:250px; } .reviews-box .big-num{ font-size:2.5rem; } .reviews-box .stars{ font-size:20px; letter-spacing:2px; } .reviews-box p{ font-size:13px; } .reviews-dots{ gap:8px; margin-top:20px; } .review-dot{ width:10px; height:10px; } .reviews-nav{ width:35px; height:35px; font-size:16px; } .reviews-nav.prev{ left:10px; } .reviews-nav.next{ right:10px; } }
    


    /* Contact page content styles */
    .page-banner { background: url('images/home\ page.jpg') center/cover no-repeat; text-align: center; color: #000; padding: 150px 0; }
    .page-banner h1 { font-size: 52px; margin-bottom: 20px; font-weight: 700; }
    .page-banner p { font-size: 20px; margin-bottom: 0; font-weight: 300; }
    .page-banner {
    position: relative;
    background: url('images/home page.jpg') center/cover no-repeat;
    text-align: center;
    color: #fff;
    padding: 150px 0;
    overflow: hidden;
}

.page-banner::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.45); /* Darkness level */
    z-index: 1;
}

.page-banner h1,
.page-banner p {
    position: relative;
    z-index: 2;
}
    .contact-info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 40px; margin-bottom: 60px; }
    .info-card { background: var(--bg-light); padding: 40px; border-radius: 10px; text-align: center; box-shadow: 0 5px 15px rgba(0,0,0,0.08); transition: 0.3s; }
    .info-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.15); }
    .info-icon { width: 70px; height: 70px; background: var(--primary-color); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; font-size: 32px; }
    .info-card h4 { font-size: 20px; color: var(--heading-color); margin-bottom: 15px; font-weight: 600; }
    .info-card p { font-size: 14px; color: var(--text-color); margin-bottom: 10px; }
    .info-card a { color: var(--primary-color); font-weight: 600; }
    .contact-content { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
    .contact-form { background: #fff; padding: 40px; border-radius: 10px; box-shadow: 0 5px 20px rgba(0,0,0,0.08); }
    .contact-form h3 { font-size: 28px; color: var(--heading-color); margin-bottom: 30px; font-weight: 600; }
    .form-group { margin-bottom: 20px; }
    .form-group label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 600; color: var(--heading-color); }
    .form-group input, .form-group textarea, .form-group select { width: 100%; padding: 12px 15px; border: 1px solid var(--border-color); border-radius: 5px; font-family: 'Rubik', sans-serif; font-size: 14px; transition: 0.3s; }
    .form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 5px rgba(123, 18, 30, 0.2); }
    .form-group textarea { resize: vertical; min-height: 120px; }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
    .contact-form .btn { display: inline-block; padding: 14px 40px; border-radius: 5px; font-weight: 600; cursor: pointer; border: none; font-size: 14px; text-transform: uppercase; transition: 0.3s; width: 100%; }
    .btn-submit { background: var(--primary-color); color: #fff; }
    .btn-submit:hover { background: var(--primary-dark); }
    .location-section { background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.08); }
    .location-map { width: 100%; height: 400px; background: #ddd; border-radius: 10px 10px 0 0; }
    .location-map iframe { width: 100%; height: 100%; border: none; border-radius: 10px 10px 0 0; }
    .location-details { padding: 40px; }
    .location-details h3 { font-size: 24px; color: var(--heading-color); margin-bottom: 25px; font-weight: 600; }
    .detail-item { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid var(--border-color); }
    .detail-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
    .detail-label { font-size: 17px; font-weight: 700; color: var(--primary-color); text-transform: uppercase; margin-bottom: 8px; }
    .detail-value { font-size: 16px; color: var(--heading-color); font-weight: 600; }
    .detail-value a { color: var(--primary-color); text-decoration: none; }
    .detail-value a:hover { text-decoration: underline; }
    .social-links { display: flex; gap: 20px; margin-top: 25px; padding-top: 25px; border-top: 1px solid var(--border-color); }
    .social-links a { width: 45px; height: 45px; border-radius: 50%; background: var(--bg-light); display: flex; align-items: center; justify-content: center; color: var(--primary-color); font-size: 18px; transition: 0.3s; }
    .social-links a:hover { background: var(--primary-color); color: #fff; }
    @media (max-width: 1024px) { .contact-content { grid-template-columns: 1fr; gap: 40px; } }
    @media (max-width: 768px) { .page-banner { padding: 90px 0; } .page-banner h1 { font-size: 42px; } .page-banner p { font-size: 16px; } .contact-info-grid { gap: 30px; } .contact-form { padding: 30px; } .location-details { padding: 30px; } }
    @media (max-width: 480px) { .page-banner { padding: 70px 0; } .page-banner h1 { font-size: 32px; } .page-banner p { font-size: 14px; } .form-row { grid-template-columns: 1fr; } .contact-form { padding: 25px; } .location-details { padding: 25px; } }

    /* ===== OUR MISSION SECTION ===== */
    /*==============================
==============================*/

.mission-section{

    position:relative;

    padding:120px 8%;

    background:url("../images/mission-bg.jpg") center center/cover no-repeat;

    overflow:hidden;

}

.mission-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        90deg,
        rgba(0,0,0,.85),
        rgba(0,0,0,.70),
        rgba(0,0,0,.45)
    );

}

.mission-container{

    position:relative;

    z-index:2;

    max-width:1400px;

    margin:auto;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:80px;

}

.mission-content{

    flex:1;

    max-width:600px;

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.15);

    border-radius:25px;

    padding:55px;

    box-shadow:

    0 20px 60px rgba(0,0,0,.35);

}

.mission-tag{

    display:inline-block;

    padding:10px 22px;

    border-radius:50px;

    background:#7B121E;

    color:#fff;

    font-size:13px;

    letter-spacing:2px;

    font-weight:600;

    margin-bottom:25px;

}

.mission-content h2{

    font-size:54px;

    color:#fff;

    line-height:1.1;

    margin-bottom:25px;

    font-weight:700;

}

.mission-content h2 span{

    display:block;

    color:#d5d5d5;

    font-weight:400;

}

.mission-content p{

    color:#d8d8d8;

    font-size:17px;

    line-height:1.9;

    margin-bottom:40px;

}

.mission-features{

    display:grid;

    grid-template-columns:1fr;

    gap:18px;

    margin-bottom:45px;

}

.feature{

    padding:16px 20px;

    border-radius:14px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    color:#fff;

    transition:.35s;

}

.feature:hover{

    transform:translateX(10px);

    background:#7B121E;

}

.mission-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 42px;

    background:#7B121E;

    color:#fff;

    text-decoration:none;

    border-radius:60px;

    font-weight:600;

    transition:.35s;

}

.mission-btn:hover{

    transform:translateY(-4px);

    box-shadow:

    0 20px 35px rgba(123,18,30,.45);

}

.mission-image{

    flex:1;

    display:flex;

    justify-content:center;

}

.mission-image img{

    width:100%;

    max-width:620px;

    border-radius:30px;

    object-fit:cover;

    box-shadow:

    0 30px 70px rgba(0,0,0,.40);

    transition:.6s;

}

.mission-image img:hover{

    transform:scale(1.04);

}

/*==============================
Responsive
==============================*/

@media(max-width:991px){

.mission-container{

flex-direction:column;

}

.mission-content{

max-width:100%;

}

.mission-content h2{

font-size:40px;

}

}

@media(max-width:600px){

.mission-content{

padding:35px;

}

.mission-content h2{

font-size:32px;

}

.mission-section{

padding:80px 20px;

}

}

    /* ===== REVIEWS SECTION ===== */
    .reviews-section {
      padding: 100px 0;
      background: #0b0e1a;
      position: relative;
      overflow: hidden;
    }
    .reviews-section::before {
      content: '';
      position: absolute;
      top: -120px;
      right: -120px;
      width: 400px;
      height: 400px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(139,26,26,0.18) 0%, transparent 70%);
      pointer-events: none;
    }
    .reviews-section::after {
      content: '';
      position: absolute;
      bottom: -100px;
      left: -100px;
      width: 320px;
      height: 320px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(123,18,30,0.14) 0%, transparent 70%);
      pointer-events: none;
    }
    .reviews-section .section-title h2 { color: #fff; }
    .reviews-section .section-title p { color: rgba(255,255,255,0.65); }
    .reviews-section .sub-title {
      background: rgba(139,26,26,0.18);
      color: #ffa5b0;
      border: 1px solid rgba(139,26,26,0.35);
    }
    .reviews-track-wrapper {
      position: relative;
      overflow: hidden;
    }
    .reviews-track {
      display: flex;
      gap: 28px;
      transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
      will-change: transform;
    }
    .review-card {
      flex: 0 0 calc(33.333% - 20px);
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.09);
      border-radius: 24px;
      padding: 36px 32px;
      position: relative;
      transition: background 0.35s, transform 0.35s, box-shadow 0.35s;
      backdrop-filter: blur(4px);
    }
    .review-card:hover {
      background: rgba(255,255,255,0.08);
      transform: translateY(-6px);
      box-shadow: 0 24px 48px rgba(0,0,0,0.4);
    }
    .review-card-quote {
      position: absolute;
      top: 22px;
      right: 28px;
      font-size: 64px;
      line-height: 1;
      color: rgba(139,26,26,0.18);
      font-family: Georgia, serif;
      pointer-events: none;
    }
    .review-stars {
      display: flex;
      gap: 4px;
      margin-bottom: 18px;
    }
    .review-stars i { color: #f4b942; font-size: 15px; }
    .review-text {
      font-size: 15px;
      color: rgba(255,255,255,0.82);
      line-height: 1.8;
      margin-bottom: 28px;
      font-style: italic;
    }
    .review-author {
      display: flex;
      align-items: center;
      gap: 14px;
    }
    .review-avatar {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      object-fit: cover;
      border: 2px solid rgba(139,26,26,0.6);
      box-shadow: 0 0 0 3px rgba(139,26,26,0.15);
    }
    .review-avatar-placeholder {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: linear-gradient(135deg, #8B1A1A, #c0283c);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      font-weight: 700;
      color: #fff;
      border: 2px solid rgba(139,26,26,0.6);
      flex-shrink: 0;
    }
    .review-author-info h5 {
      font-size: 15px;
      font-weight: 700;
      color: #fff;
      margin: 0 0 4px;
    }
    .review-author-info p {
      font-size: 13px;
      color: rgba(255,255,255,0.5);
      margin: 0;
    }
    .review-badge-label {
      display: inline-block;
      background: rgba(139,26,26,0.22);
      color: #ffa5b0;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 3px 10px;
      border-radius: 999px;
      margin-top: 6px;
    }
    /* Navigation controls */
    .reviews-controls {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 16px;
      margin-top: 48px;
    }
    .reviews-nav-btn {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: rgba(255,255,255,0.07);
      border: 1px solid rgba(255,255,255,0.15);
      color: #fff;
      font-size: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: background 0.25s, transform 0.25s, border-color 0.25s;
    }
    .reviews-nav-btn:hover {
      background: #8B1A1A;
      border-color: #8B1A1A;
      transform: scale(1.08);
    }
    .reviews-pagination {
      display: flex;
      gap: 8px;
    }
    .reviews-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: rgba(255,255,255,0.25);
      cursor: pointer;
      transition: background 0.3s, transform 0.3s;
      border: none;
      padding: 0;
    }
    .reviews-dot.active {
      background: #8B1A1A;
      transform: scale(1.35);
    }
    /* Stats bar */
    .reviews-stats-bar {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 48px;
      padding: 40px 0 10px;
      flex-wrap: wrap;
    }
    .reviews-stat {
      text-align: center;
    }
    .reviews-stat-num {
      font-size: 2.6rem;
      font-weight: 800;
      color: #fff;
      line-height: 1;
      margin-bottom: 6px;
    }
    .reviews-stat-num span { color: #ffa5b0; }
    .reviews-stat-label {
      font-size: 13px;
      color: rgba(255,255,255,0.55);
      letter-spacing: 0.5px;
    }
    .reviews-divider {
      width: 1px;
      height: 44px;
      background: rgba(255,255,255,0.12);
    }
    @media (max-width: 900px) {
      .review-card { flex: 0 0 calc(50% - 14px); }
      .mission-section { background-attachment: scroll; }
    }
    @media (max-width: 640px) {
      .review-card { flex: 0 0 100%; }
      .reviews-stat-num { font-size: 2rem; }
      .reviews-divider { display: none; }
      .reviews-stats-bar { gap: 24px; }
      .mission-pillars { grid-template-columns: 1fr; }
    }

/* ==========================================================================
   RESPONSIVE NAVBAR & INNER PAGE FIXES
   ========================================================================== */

/* Header on inner pages (non-home) */
.inner-page-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
  background: transparent;
  padding-top: 15px;
}

.logo img {
  height: 80px;
  max-width: 150px;
  object-fit: contain;
  display: block;
}




/* Page Banner Height (Matching Home Page) */
.page-banner-inner {
  position: relative;
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #fff;
  text-align: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.page-banner-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,6,20,0.85) 0%, rgba(0,6,20,0.7) 50%, rgba(0,6,20,0.92) 100%);
  z-index: 1;
}

.page-banner-inner .container {
  position: relative;
  z-index: 2;
  max-width: 1000px;
  margin: 0 auto;
  padding: 160px 20px 90px;
}

.page-banner-inner h1 {
  font-family: 'Times New Roman', Times, serif;
  font-size: clamp(2.4rem, 4.5vw, 4.2rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 18px;
  color: #fff;
}

.page-banner-inner p {
  font-size: clamp(1rem, 1.2vw, 1.3rem);
  line-height: 1.7;
  max-width: 820px;
  margin: 0 auto 30px;
  color: rgba(255,255,255,0.92);
}

/* Content Sections Styling */
.cert-content-section {
  padding: 70px 0;
  background: #ffffff;
}

.cert-container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 20px;
}

.cert-grid-2col {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 40px;
  align-items: stretch;
  position: relative;
}

.cert-main-col {
  min-width: 0;
}

.cert-sidebar-col {
  position: relative;
  align-self: stretch;
}

.cert-card-box {
  background: #ffffff;
  border-radius: 14px;
  padding: 35px;
  border: 1px solid #e2e8f0;
  margin-bottom: 30px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.cert-card-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.07);
  border-color: #cbd5e1;
}

.cert-card-box h3 {
  font-family: 'Times New Roman', Times, serif;
  font-size: 26px;
  color: #000b1c;
  margin-bottom: 15px;
  position: relative;
  padding-bottom: 10px;
}

.cert-card-box h3::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 45px;
  height: 3px;
  background: var(--red);
}

.cert-card-box p {
  color: #4b5563;
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 15px;
}

.cert-features-list {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}

.cert-features-list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 12px;
  font-size: 15px;
  color: #334155;
  line-height: 1.6;
}

.cert-features-list li::before {
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 2px;
  color: var(--red);
  font-size: 14px;
}

/* Process Steps */
.cert-process-wrapper {
  margin-top: 25px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cert-process-step {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 14px 18px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #edf2f7;
  transition: all 0.25s ease;
}

.cert-process-step:hover {
  transform: translateX(6px);
  border-color: #cbd5e1;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(0,0,0,0.04);
}

.cert-step-num {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--red);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  flex-shrink: 0;
  box-shadow: 0 4px 10px rgba(186, 28, 28, 0.25);
}

.cert-step-success .cert-step-num {
  background: #166534;
  box-shadow: 0 4px 10px rgba(22, 101, 52, 0.25);
}

.cert-step-body h5 {
  font-size: 16px;
  font-weight: 700;
  color: #000b1c;
  margin: 0 0 4px 0;
}

.cert-step-body p {
  font-size: 14px;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
}

/* Sticky Right Sidebar */
.cert-sidebar-widget {
  background: #ffffff;
  border-radius: 14px;
  padding: 28px 24px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  position: -webkit-sticky;
  position: sticky;
  top: 30px;
  z-index: 15;
  max-height: calc(100vh - 60px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}

.cert-sidebar-widget::-webkit-scrollbar {
  width: 5px;
}

.cert-sidebar-widget::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

@media (max-width: 860px) {
  .cert-grid-2col {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .cert-sidebar-col {
    align-self: auto;
  }
  .cert-sidebar-widget {
    position: static;
    top: auto;
    max-height: none;
    overflow-y: visible;
    margin-bottom: 0;
  }
}

.cert-sidebar-widget h4 {
  font-size: 20px;
  font-weight: 700;
  color: #000b1c;
  margin-bottom: 18px;
  font-family: 'Montserrat', sans-serif;
  border-bottom: 2px solid var(--red);
  padding-bottom: 10px;
}

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

.cert-sidebar-list li {
  margin-bottom: 8px;
}

.cert-sidebar-list li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: #f8fafc;
  border-radius: 6px;
  color: #334155;
  font-size: 14px;
  font-weight: 600;
  transition: all 0.2s;
  text-decoration: none;
}

.cert-sidebar-list li a:hover,
.cert-sidebar-list li a.active {
  background: var(--red);
  color: #ffffff;
  padding-left: 18px;
}

.cert-cta-box {
  background: linear-gradient(135deg, #8B1A1A, #5a0d16);
  color: #ffffff;
  border-radius: 12px;
  padding: 30px;
  text-align: center;
  margin-top: 25px;
}

.cert-cta-box h4 {
  font-size: 20px;
  color: #fff;
  margin-bottom: 10px;
  font-family: 'Montserrat', sans-serif;
}

.cert-cta-box p {
  font-size: 14px;
  color: rgba(255,255,255,0.9);
  margin-bottom: 20px;
}

.cert-cta-box .btn-white {
  display: inline-block;
  background: #ffffff;
  color: var(--red);
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  text-transform: uppercase;
  transition: all 0.2s;
}

.cert-cta-box .btn-white:hover {
  background: #f1f5f9;
  transform: translateY(-2px);
}

/* ==========================================================================
   MANAGEMENT CERTIFICATIONS & 3-COLUMN SERVICE CARDS
   ========================================================================== */
.grid-3col {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}

.custom-service-card {
  background: #ffffff;
  border-radius: 14px;
  padding: 30px 26px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
  position: relative;
}

.custom-service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.08);
  border-color: #cbd5e1;
}

.card-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: rgba(139, 26, 26, 0.08);
  color: #8B1A1A;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 16px;
  transition: all 0.3s ease;
}

.custom-service-card:hover .card-icon {
  background: #8B1A1A;
  color: #ffffff;
  transform: scale(1.08) rotate(-4deg);
}

.card-category-badge {
  display: inline-block;
  align-self: flex-start;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #8B1A1A;
  background: rgba(139, 26, 26, 0.06);
  padding: 4px 10px;
  border-radius: 6px;
  margin-bottom: 12px;
}

.custom-service-card h3 {
  font-family: 'Times New Roman', Times, serif;
  font-size: 20px;
  font-weight: 700;
  color: #000b1c;
  margin: 0 0 10px 0;
  line-height: 1.35;
}

.custom-service-card p {
  color: #4b5563;
  font-size: 14px;
  line-height: 1.65;
  margin: 0 0 22px 0;
  flex-grow: 1;
}

.card-btn-row {
  display: flex;
  gap: 10px;
  margin-top: auto;
}

.card-btn {
  display: inline-block;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  text-align: center;
  transition: all 0.25s ease;
  font-family: 'Montserrat', sans-serif;
}

.card-btn-primary {
  flex: 1.4;
  background: #8B1A1A;
  color: #ffffff;
  border: 1px solid #8B1A1A;
}

.card-btn-primary:hover {
  background: #6a1313;
  border-color: #6a1313;
  color: #ffffff;
}

.card-btn-outline {
  flex: 1;
  background: #f8fafc;
  color: #000b1c;
  border: 1px solid #cbd5e1;
}

.card-btn-outline:hover {
  background: #000b1c;
  color: #ffffff;
  border-color: #000b1c;
}

@media (max-width: 960px) {
  .grid-3col {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  }
}

@media (max-width: 580px) {
  .grid-3col {
    grid-template-columns: 1fr;
  }
}