
/* ===== Journey / Milestones Timeline ===== */
.journey-section{
    background:#fff;
    padding:50px 0 60px;
    overflow-x:auto;
}

.journey-pretitle{
    font-size:16px;
    font-weight:700;
    color:#000;
    margin:0 0 8px 0;
}

.journey-header{
    display:grid;
    grid-template-columns: 1.2fr 1.1fr 1.35fr 0.35fr 2.7fr 0.35fr 1.25fr;
    border:1px solid #0d2b75;
    margin-bottom:35px;
    background:#dfe8f8;
    min-width:1300px;
}

.journey-header div{
    border-right:1px solid #0d2b75;
    text-align:center;
    padding:5px 8px;
    font-size:14px;
    font-weight:800;
    color:#0d2b75;
    line-height:1.2;
    text-transform:uppercase;
    white-space:nowrap;
}

.journey-header div:last-child{
    border-right:none;
}

.journey-timeline{
    position:relative;
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
    min-width:1300px;
    padding-top:5px;
}

.journey-timeline::before{
    content:"";
    position:absolute;
    left:4%;
    right:4%;
    top:205px;
    height:5px;
    background:#0b3a8b;
    z-index:1;
}

.journey-item{
    width:16%;
    text-align:center;
    position:relative;
    z-index:2;
    flex:0 0 auto;
}

.journey-year{
    font-family:"Teko", sans-serif;
    font-size:48px;
    line-height:0.9;
    font-weight:700;
    color:#0b2b7a;
    margin-bottom:4px;
}

.journey-dot{
    width:14px;
    height:14px;
    border-radius:50%;
    background:#0b2b7a;
    margin:0 auto;
}

.journey-connector{
    width:2px;
    height:45px;
    margin:0 auto;
    border-left:3px dotted #0b2b7a;
}

.journey-circle{
    width:150px;
    height:150px;
    margin:0 auto;
    border-radius:50%;
    background:#0b3a8b;
    border:5px solid #ffffff;
    outline:4px solid #0b3a8b;
    display:flex;
    align-items:center;
    justify-content:center;
}

.journey-circle i{
    color:#fff;
    font-size:65px;
    line-height:1;
}

.journey-desc{
    margin-top:20px;
    width:220px;
    max-width:220px;
    margin-left:auto;
    margin-right:auto;
    font-style:italic;
    font-size:16px;
    line-height:1.6;
    color:#1d1d1d;
}

.journey-desc strong{
    font-style:italic;
}

@media (max-width:1700px){
    .journey-header,
    .journey-timeline{
        min-width:1300px;
    }
}

@media (max-width:992px){
    .journey-section{
        overflow-x:auto;
    }
}
/* ==========================================
   GLOBAL PATCHES & OVERRIDES
========================================== */

/* ------------------------------------------
   ABOUT SECTION
------------------------------------------ */

.about-section .row{
    align-items:flex-start !important;
}

.about-image{
    height:100%;
    margin-bottom:0 !important;
}

.about-image img{
    width:100%;
    height:auto;
    max-height:700px;
    object-fit:cover;
    border-radius:8px;
    display:block;
}

.about-content{
    height:100%;
    display:flex;
    flex-direction:column;
}

/* ------------------------------------------
   SUBTITLE DEFAULT
------------------------------------------ */

.section-subtitle{
    display:block;
    color:var(--primary);
    font-size:16px;
    font-weight:500;
    letter-spacing:3px;
    text-transform:uppercase;
    margin-bottom:15px;
}

.about-content h2{
    font-size:36px !important;
    line-height:1.2;
    font-weight:700;
}
/* NEWS & INSIGHTS Subtitle */
.news-section .section-subtitle{
    font-size:32px !important;
    font-weight:700 !important;
    color:#0726A8;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

/* NEWS & INSIGHTS Heading */
.news-section h2{
    font-size:36px !important;
    line-height:1.2;
    font-weight:700;
}

#careers .section-heading h2{
    font-size:36px !important;
    line-height:1.2;
    font-weight:700;
}
/* ------------------------------------------
   ABOUT CONTENT
------------------------------------------ */

.about-content h2{
    font-size:52px;
    line-height:1.1;
    margin-bottom:20px;
    font-weight:800 !important;
}

.about-content p[style*="italic"]{
    font-size:18px !important;
    line-height:1.6 !important;
    margin-bottom:20px !important;
    color:var(--primary);
}


.md-signature{
    margin-top:40px;
    padding-top:20px;
}

.md-signature p{
    margin:0;
    line-height:1.7;
    font-weight:600;
}

/* ------------------------------------------
   STAT BOX
------------------------------------------ */

.stat-box{
    background:#fff !important;
    border:1px solid #e5e7eb !important;
}

.stat-box h3{
    color:#0726A8 !important;
    transition:.3s ease;
}

.stat-box p{
    color:#666 !important;
    transition:.3s ease;
    text-align:center;
}

.stat-box:hover h3,
.stat-box:hover p{
    color:#000 !important;
}

/* ------------------------------------------
   BUTTONS
------------------------------------------ */

.theme-btn,
.hero-btn{
    background:#fff !important;
    color:#0726A8 !important;
    border:2px solid #0726A8 !important;
}

.theme-btn i,
.hero-btn i{
    color:#0726A8 !important;
}

.theme-btn:hover,
.hero-btn:hover{
    background:#fff !important;
    color:#000 !important;
    border-color:#000 !important;
}

.theme-btn:hover i,
.hero-btn:hover i{
    color:#000 !important;
}

/* ------------------------------------------
   HERO SUBTITLE FIX
------------------------------------------ */

.about-hero .section-subtitle,
.ops-hero-v2 .section-subtitle,
.sus-hero-copy .section-subtitle,
.news-hero .section-subtitle,
.news-hero-content .section-subtitle,
.careers-hero-content .section-subtitle,
.contact-hero .section-subtitle{
    font-size:16px !important;
    font-weight:500 !important;
    letter-spacing:3px !important;
    line-height:1.2 !important;
    text-transform:uppercase !important;
    margin-bottom:15px !important;
}

.about-hero .section-subtitle,
.ops-hero-v2 .section-subtitle,
.sus-hero-copy .section-subtitle,
.news-hero .section-subtitle,
.news-hero-content .section-subtitle,
.careers-hero-content .section-subtitle{
    color:#fff !important;
}

.contact-hero .section-subtitle{
    color:#20C4FF !important;
}

/* ------------------------------------------
   CENTER ALIGN ELEMENTS
------------------------------------------ */

.section-heading{
    text-align:center;
}

.section-heading h2,
.section-heading h3{
    text-align:center;
}

.section-heading p{
    text-align:center;
    max-width:800px;
    margin-left:auto;
    margin-right:auto;
}

/* ------------------------------------------
   KEEP THESE LEFT ALIGNED
------------------------------------------ */

.contact-channel,
.office-panel,
.faq-panel,
.process-card,
.job-card,
.career-card,
.career-track,
.news-card,
.blog-card{
    text-align:left;
}

.contact-channel p,
.office-panel p,
.faq-panel p,
.process-card p,
.job-card p,
.career-card p,
.career-track p,
.news-card p,
.blog-card p{
    text-align:left;
}

/* ------------------------------------------
   JUSTIFY ONLY LONG CONTENT
------------------------------------------ */

.about-content p,
.md-text,
.legal-content p,
.policy-content p,
.privacy-content p,
.terms-content p,
.cookie-content p{
    text-align:justify;
}

/* ------------------------------------------
   READABILITY
------------------------------------------ */

.about-content,
.life-content,
.office-panel,
.contact-form-panel{
    text-wrap:pretty;
}

/* ------------------------------------------
   MOBILE
------------------------------------------ */

@media(max-width:991px){

    .about-image{
        margin-bottom:30px !important;
    }

    .about-image img{
        max-height:500px;
    }

    .about-content p,
    .md-text,
    .legal-content p,
    .policy-content p{
        text-align:left;
    }

    .about-hero .section-subtitle,
    .ops-hero-v2 .section-subtitle,
    .sus-hero-copy .section-subtitle,
    .news-hero .section-subtitle,
    .news-hero-content .section-subtitle,
    .careers-hero-content .section-subtitle,
    .contact-hero .section-subtitle{
        font-size:16px !important;
    }
}
.team-card img{
    width:100%;
    height:320px;
    object-fit:cover;
    object-position:center top;
}
.value-card{
    padding:30px;
}

.value-card .icon{
    margin-bottom:18px;
    font-size:24px;
}
.stat-box{
    min-height:140px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:25px;
}

.stat-box h3{
    margin-bottom:12px;
}

.stat-box p{
    margin:0;
}

.solution-card p{
    text-align:left;
}
.operation-content p{
    text-align:left;
}

.operation-content{
    padding:30px;
}
.operation-content h3{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
}
.operation-content h3{
    text-align:center;
}
.operation-content h3{
    font-size:28px !important;
    font-weight:600;
}
.section-subtitle{
    margin-bottom:8px !important;
}

.operation-content p{
    text-align:justify;
    text-justify:inter-word;
}
/* ESG Section Subtitle Gap Fix */
.sustainability-section .section-subtitle,
.esg-section .section-subtitle {
    margin-bottom: 8px !important;
}

.sustainability-section h2,
.esg-section h2 {
    margin-top: 0 !important;
}
.section-subtitle{
    margin-bottom:5px !important;
}

.page-hero-content h1,
.about-hero-content h1,
.ops-hero-copy h1,
.sus-hero-copy h1,
.news-hero-content h1,
.careers-hero-content h1,
.contact-hero-content h1{
    font-family: "Teko", sans-serif;
    font-size: clamp(60px, 7vw, 80px);
    font-weight: 600;
    line-height: 0.9;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.about-hero-content p{
    text-align: justify;
    hyphens: auto;
}
.about-section .section-subtitle{
    font-size:34px !important;
    font-weight:700 !important;
    color:#0726A8;
    letter-spacing:1.2px;
    text-transform:uppercase;
}
.about-content h2{
    text-align:center;
}
.section-subtitle{
    font-size:32px !important;
    font-weight:700 !important;
    color:#0726A8;
    letter-spacing:1px;
    text-transform:uppercase;
}


.section-subtitle{
    font-size:32px !important;
    font-weight:700 !important;
    color:#0726A8;
    letter-spacing:1.5px;
    text-transform:uppercase;
}
.section-heading h2,
.about-content h2{
    font-size:36px !important;
    line-height:1.2;
    font-weight:700;
}
.about-hero-content h1,
.ops-hero-copy h1,
.sus-hero-copy h1,
.news-hero-content h1,
.careers-hero-content h1,
.contact-hero-content h1{
    font-size:clamp(60px,7vw,80px);
    font-weight:600;
    line-height:.9;
}
/* =====================================
   ABOUT PAGE - MISSION & VISION
===================================== */

/* OUR PURPOSE */
.operations-section .section-subtitle{
    font-size:32px !important;
    font-weight:700 !important;
    color:#0726A8 !important;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

/* Mission & Vision Heading */
.operations-section .section-heading h2{
    font-size:42px !important;
    line-height:1.1;
    font-weight:700;
    text-align:center;
}

/* Cards */
.operations-section .value-card{
    padding:40px !important;
    text-align:center;
    height:100%;
}

/* Icons */
.operations-section .value-card .icon{
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:20px;
}

.operations-section .value-card .icon i{
    font-size:36px !important;
    color:#2D3192 !important;
}

/* OUR MISSION / OUR VISION */
.operations-section .value-card h3{
    font-size:28px !important;
    font-weight:700;
    text-transform:uppercase;
    text-align:center;
    margin-bottom:20px;
    color:#0F172A;
}

/* Paragraph */
.operations-section .value-card p{
    font-size:18px;
    line-height:1.8;
    text-align:justify;
    color:#334155;
    margin-bottom:0;
}
.operations-section .value-card h3{
    font-size:24px !important;
    font-weight:700;
    text-transform:uppercase;
    text-align:center;
    color:#0726A8 !important; /* Dark Blue */
}
/* =====================================
   CORE VALUES SECTION
===================================== */

/* WHAT WE STAND FOR */
.news-section .section-subtitle{
    font-size:32px !important;
    font-weight:700 !important;
    color:#0726A8 !important;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

/* Our Core Values */
.news-section .section-heading h2{
    font-size:42px !important;
    line-height:1.1;
    font-weight:700;
    text-align:center;
}

/* Cards */
.news-section .value-card{
    text-align:center;
    padding:35px 25px !important;
    height:100%;
}

/* Icons */
.news-section .value-card .icon{
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:20px;
}

.news-section .value-card .icon i{
    font-size:34px !important;
    color:#0726A8 !important;
}

/* Integrity, Innovation, Collaboration... */
.news-section .value-card h3{
    font-size:24px !important;
    font-weight:700;
    color:#0726A8 !important;
    text-align:center;
    margin-bottom:15px;
}

/* Paragraph */
.news-section .value-card p{
    font-size:16px;
    line-height:1.8;
    text-align:center;
    color:#334155;
    margin-bottom:0;
}

.about-content p[style*="font-style:italic"]{
    font-size:16px !important;
    line-height:1.6 !important;
}
.md-text{
    font-size:16px !important;
    line-height:1.8 !important;
    margin-bottom:12px !important;
}
.hero-glass-card{
    background: rgba(255,255,255,0.04) !important;

    backdrop-filter: blur(14px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(180%) !important;

    border: 1px solid rgba(255,255,255,0.12);

    box-shadow:
        0 8px 32px rgba(0,0,0,.20);

    border-radius: 24px;
}

/* ABOUT HERO STYLE = ALL HERO PAGES */

.ops-hero-copy h1,
.sus-hero-copy h1,
.news-hero-content h1,
.careers-hero-content h1,
.contact-hero-content h1{
    font-family:"Teko",sans-serif !important;
    font-size:clamp(60px,7vw,80px) !important;
    font-weight:600 !important;
    line-height:0.9 !important;
    letter-spacing:1px !important;
    text-transform:uppercase !important;
}

.ops-hero-copy p,
.sus-hero-copy p,
.news-hero-content p,
.careers-hero-content p,
.contact-hero-content p{
    max-width:660px !important;
    font-size:20px !important;
    line-height:1.8 !important;
    color:#dce5ff !important;
    text-align:justify !important;
}
/* IMAGE TOP = SUBTITLE TOP */

.ops-intro-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:48px;
    align-items:start !important;
}

.ops-intro-image,
.ops-intro-copy{
    margin-top:0 !important;
    padding-top:0 !important;
    align-self:start !important;
}

.ops-intro-copy .section-subtitle{
    display:block;
    margin-top:0 !important;
    padding-top:0 !important;
    margin-bottom:10px !important;
}

.ops-intro-copy h2{
    margin-top:0 !important;
}
/* ==========================================
   SECTOR DISPLAY ALIGNMENT FIX
========================================== */

.sector-display{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:start !important;
}

.sector-display-copy{
    padding-top:0 !important;
    margin-top:0 !important;
    align-self:start !important;
}

.sector-display-copy h3{
    margin-top:0 !important;
    margin-bottom:20px !important;

    font-size:32px !important;
    line-height:1.15 !important;
}

.sector-display-copy p{
    text-align:justify !important;
    text-justify:inter-word;
    line-height:1.9 !important;
    margin-bottom:20px !important;
}

.sector-display-copy ul{
    margin-top:20px;
}

.sector-display-copy li{
    text-align:left;
    line-height:1.8;
}

.sector-display-image,
.sector-display-image img{
    margin-top:0 !important;
    display:block;
}
/* ==========================================
   SECTOR TAB HOVER EFFECT
========================================== */

.sector-tab{
    position:relative;
    overflow:hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease,
        background .35s ease;
}

/* Hover */


/* Active */

.sector-tab.active{
    background:#eaf8ff;
    border-color:#0726A8;
}

/* Icon Circle */

.sector-tab i{
    transition:all .35s ease;
}

.sector-tab:hover i{
    transform:scale(1.08);
}

/* Text */

.sector-tab span{
    transition:all .35s ease;
}

.sector-tab:hover span{
    color:#0726A8;
}
.sector-tab::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;

    width:60%;
    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.6),
        transparent
    );

    transition:.7s;
}

.sector-tab:hover::before{
    left:130%;
}
.sector-tab.active{
    background:#f6fbff;
    border-color:#0726A8;
    box-shadow:none;
}
/* FIX SECTOR TAB HOVER */

.sector-tab,
.sector-tab:hover,
.sector-tab.active{
    background:#ffffff !important;
    color:#374151 !important;
}

.sector-tab:hover{
    border:1.5px solid #000 !important;
    box-shadow:none !important;
    transform:translateY(-2px);
}

.sector-tab.active{
    background:#fff !important;
    border:1.5px solid #000 !important;
    box-shadow:none !important;
}

.sector-tab span,
.sector-tab:hover span,
.sector-tab.active span{
    color:#374151 !important;
}

.sector-tab i{
    background:transparent !important;
    color:#0726A8 !important;
}

.sector-tab.active i,
.sector-tab:hover i{
    background:transparent !important;
    color:#000 !important;
}
.sector-tab.active i,
.sector-tab:hover i{
    background:transparent !important;
    color:#000 !important;
}
.md-text{
    font-size:16px !important;
    line-height:1.8 !important;
}

@media (max-width: 992px) {
    .container-custom {
        padding-left: 24px;
        padding-right: 24px;
    }

    .section-heading {
        margin-bottom: 42px;
    }

    .section-heading h2 {
        font-size: 46px !important;
    }

    .section-subtitle {
        font-size: 24px !important;
        letter-spacing: 1.2px !important;
    }

    .about-section .section-subtitle,
    .news-section .section-subtitle,
    .operations-section .section-subtitle {
        font-size: 24px !important;
    }

    .operation-img img,
    .news-img img {
        height: 260px;
    }

    .header-inner {
        gap: 18px;
    }

    .mobile-nav {
        width: min(88vw, 320px);
        padding: 100px 28px 32px;
    }
}

@media (max-width: 768px) {
    :root {
        --header-height: 64px;
    }

    .container-custom {
        padding-left: 20px;
        padding-right: 20px;
    }

    section:not(.page-hero-section):not(.hero-section) {
        padding: 64px 0;
    }

    .section-heading {
        margin-bottom: 32px;
    }

    .section-heading h2 {
        font-size: 40px !important;
    }

    .section-heading p {
        margin-top: 14px;
    }

    .section-subtitle,
    .about-section .section-subtitle,
    .news-section .section-subtitle,
    .operations-section .section-subtitle,
    .careers-hero-content .section-subtitle,
    .contact-hero .section-subtitle,
    .news-hero-content .section-subtitle,
    .sus-hero-copy .section-subtitle,
    .ops-hero-v2 .section-subtitle,
    .about-hero .section-subtitle {
        font-size: 18px !important;
        letter-spacing: 1px !important;
        margin-bottom: 10px !important;
    }

    .operation-img img,
    .news-img img {
        height: 220px;
    }

    .operation-content,
    .news-content {
        padding: 22px;
    }

    .operation-content h3,
    .news-content h3 {
        font-size: 24px;
    }

    .search-container {
        padding: 24px 18px;
    }

    .search-panel-heading h2 {
        font-size: 34px;
    }

    .search-form {
        grid-template-columns: 1fr 52px;
    }

    .search-form button,
    .search-btn {
        width: 52px !important;
        height: 52px !important;
    }

    .main-header .header-inner {
        height: 64px;
        gap: 12px;
    }

    .logo img {
        max-height: 44px;
        max-width: 170px;
    }
}

@media (max-width: 576px) {
    :root {
        --header-height: 60px;
        --container-padding: 15px;
    }

    .container-custom {
        padding-left: 15px;
        padding-right: 15px;
    }

    section:not(.page-hero-section):not(.hero-section) {
        padding: 56px 0;
    }

    .section-heading h2 {
        font-size: 32px !important;
    }

    .section-heading p {
        font-size: 15px;
        line-height: 1.7;
    }

    .main-header .header-inner {
        height: 60px;
        gap: 10px;
    }

    .logo img {
        max-height: 40px;
        max-width: 150px;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .theme-btn {
        width: 100%;
        justify-content: center;
    }

    .mobile-nav {
        width: 100vw;
        max-width: 320px;
        padding: 92px 22px 32px;
    }

    .search-container {
        padding: 22px 16px;
    }

    .search-panel-heading h2 {
        font-size: 28px;
    }

    .search-form input {
        font-size: 15px;
        height: 52px;
    }
}
