section.banner {
    background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-about-banner.jpg);
    min-height: 700px;
    display: flex;
    align-items: center;
    background-size: cover;
    background-position: bottom center;
}

section.banner.contact {
  background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-contact-bg.jpg);
}

section.banner.contact h2.heading {
  padding-bottom: 30px;
}



section.insight {
    background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-insight-bg.jpg);
}


section.ceo p.para {
    width: 84%;
}

section.ab-sec2.seosec h2.heading2 {
    line-height: 70px;
}

section.ab-sec2.seosec {}

section.ab-sec2.seosec .col-xl-5 {
    padding-left: 050px;
    padding-right: 140px;
}

section.brand {
    background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-brand-bg.jpg);
}

section.footprint {
    background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-global-bg.jpg);
}


section.ceo {
    background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-ceo-banner.jpg);
    background-position: center;
}


h2.heading {
    color: #fff;
    font-size: 80px;
    font-weight: 600;
    line-height: 74.8px;
    letter-spacing: -1.84px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    position: relative;
}

h2.heading:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    width: 100px;
    background: #E7000B;
}

p.para {
    font-size: 16px;
    color: #fff;
    margin-bottom: 30px;
    font-weight: 500;
}

.ab-sec2.seosec span.liner {
  padding-left: 120px;
}

.ab-sec2.seosec span.liner:after {
  top: 43px;
}


section.banner p.para {
    text-transform: uppercase;
}
section.ab-sec2 .globe-sec img {
    width: 100%;
}



section.ab-sec2 .container-fluid {
    max-width: 100% !important;
    padding: 80px 0;
    overflow: hidden;
}

section.ab-sec2 .container-fluid .col-xl-5 {
    display: flex;
    align-items: center;
    padding-left: 140px;
}

span.liner {
    display: block;
    margin-top: 30px;
    text-transform: uppercase;
    font-size: 18px;
    position: relative;
    padding-top: 30px;
    color: #121418;
}

span.liner:after {
    content: "";
    position: absolute;
    /* border: 1px solid; */
    height: 3px;
    width: 100px;
    top: 0;
    left: 0;
    background: #E70012;
}

h2.heading2 {
    font-size: 75px;
    font-weight: 600;
    line-height: 60px;
    margin-bottom: 20px;
}


/* ================================
   STRATEGY SECTION
================================ */

.strategy-section {
  position: relative;
  width: 100%;
  padding: 60px 0px 0 0;
  background: #08090a;
  color: #fff;
  overflow: hidden;
  font-family: "Montserrat", sans-serif;
  background-image: url(https://rarholding.com/wp-content/uploads/2026/10/ds-about-stragtegy-banner.jpg);
  background-size: cover;
}


/* HEADER */

.strategy-header {
  max-width: 1050px;
  margin: 0 auto 55px;
  text-align: center;
}

.strategy-header h2 {
  font-size: 75px;
  font-weight: 700;
  line-height: 74.8px;
  margin-bottom: 10px;
}

.strategy-header span {
  font-weight: 500;
  letter-spacing: .4px;
  display: block;
  text-transform: uppercase;
  font-size: 13px;
  margin-bottom: 20px;
  margin-top: 40px;
}

.strategy-header p {
  max-width: 800px;
  margin: auto;
  font-size: 20px;
  /* line-height: 1.45; */
  /* font-weight: 300; */
  color: #F7F7F5;
}


/* GRID */

.strategy-grid {
  max-width: 1400px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: stretch;
}


/* CARD */

.strategy-card {
  position: relative;
  min-height: 470px;
  padding: 75px 35px 55px;
  text-align: center;
  overflow: hidden;

  display: flex;
  flex-direction: column;
  align-items: center;

  background: transparent;
  transition:
    color .45s ease,
    transform .45s cubic-bezier(.22,1,.36,1);
}


/* RED BACKGROUND */

.strategy-card::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -100%;
  height: 100%;
  background: #ff001f;
  z-index: 0;

  transition:
    bottom .55s cubic-bezier(.22,1,.36,1);
}


/* HOVER RED */

.strategy-card:hover::before {
  bottom: 0;
}


/* KEEP CONTENT ABOVE RED */

.strategy-card > * {
  position: relative;
  z-index: 2;
}


/* ICON */

.strategy-icon {
  width: 65px;
  height: 65px;
  margin-bottom: 25px;
}

.strategy-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #fff;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* HEADING */

.strategy-card h3 {
  margin: 0;
  min-height: 60px;
  font-size: 22px;
  line-height: 25px;
  font-weight: 100;
  /* letter-spacing: -1px; */
}


/* SMALL RED LINE */

.strategy-line {
  width: 45px;
  height: 3px;
  margin: 12px 0 15px;
  background: #ff001f;
  transition:
    background .35s ease,
    width .35s ease;
}


/* HOVER LINE */

.strategy-card:hover .strategy-line {
  background: #fff;
  width: 45px;
}


/* DESCRIPTION */

.strategy-card p {
  max-width: 290px;
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 300;
  color: #ddd;
}


/* CARD HOVER EFFECT */

.strategy-card:hover {
  /* transform: translateY(-5px); */
}

.strategy-card:hover p {
  color: #fff;
}


/* ================================
   MOBILE
================================ */

@media (max-width: 1024px) {

  .strategy-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .strategy-card {
    min-height: 430px;
  }

}


@media (max-width: 600px) {

  .strategy-section {
    padding: 50px 15px;
  }

  .strategy-header {
    margin-bottom: 30px;
  }

  .strategy-header h2 {
    font-size: 46px;
  }

  .strategy-header p {
    font-size: 16px;
  }

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

  .strategy-card {
    min-height: 390px;
    padding: 60px 25px 45px;
  }

  .strategy-card h3 {
    font-size: 25px;
  }

  .strategy-card p {
    font-size: 17px;
  }

}
section.ab-sec2.ab-sec3 {}

section.ab-sec2.ab-sec3 .ceo-content {padding-left: 132px;display: flex;flex-direction: column;justify-content: space-between;min-height: 450px;}

section.ab-sec2.ab-sec3 .ceo-content h2.heading2 {
    position: relative;
    padding-bottom: 14px;
}


    .ab-sec2.seosec .ceo-content {
        padding-right: calc(0px * 1);
    }


section.ab-sec2.ab-sec3 .ceo-content h2.heading2:after {
    content: "";
    position: absolute;
    height: 4px;
    width: 100px;
    bottom: 0;
    left: 0;
    background: #f50018;
}

section.ab-sec2.ab-sec3 .ceo-content p {
    color: #121418;
    font-size: 32px;
}

section.ab-sec2.ab-sec3 .col-xl-6 {
    display: flex;
    align-items: center;
    padding: 0;
}

section.ab-sec2.ab-sec3 .ceo-content .iner {}

section.ab-sec2.ab-sec3 .ceo-content span.liner {
    margin: 0;
}

section.ab-sec2.ab-sec3 .ceo-content span.liner:after {
    width: 50px;
}

section.ab-sec2.ab-sec3 .container-fluid {
    padding: 0;
}

section.ab-sec2.ab-sec3.ab-sec33 {}

section.ab-sec2.ab-sec3.ab-sec33 .ceo-content {
    padding-left: calc(90px * 0.75);
    padding-right: 132px;
}


.strategy-header .port-hea {
  display: inline-block;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: bold;
  padding-left: 50px;
  position: relative;
}

.strategy-header .port-hea::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 50%;
  width: 35px;
  height: 3px;
  background: #ff001f;
}


/* =====================================================
   COMPLETE SECTION
===================================================== */

.story-section{
    position:relative;
    width:100%;
    min-height:1050px;
    background:#000;
    overflow:hidden;
    padding-top:60px;
}


/* =====================================================
   TOP — OUR STORY CONTINUES
===================================================== */

.story-top{
    position:relative;
    z-index:20;
    width:100%;
    text-align:center;
}

.story-square{
    width:13px;
    height:13px;
    background:#ff001f;
    margin:0 auto 11px;
}

.story-label{
    color:#777;
    font-size: 12px;
    line-height:1.25;
    font-weight:400;
}


/* thin vertical line under label */

.story-label-line{
    width:1px;
    height:43px;
    background:#222;
    margin:14px auto 0;
}


/* =====================================================
   MAIN HEADING
===================================================== */

.story-heading{
    position:relative;
    z-index:20;
    width:100%;
    max-width:850px;
    margin: 0px auto 0;
    text-align:center;
}

.story-heading h1{
    margin:0;
    color:#f5f5f5;
    font-size: 66px;
    line-height:.96;
    font-weight:600;
    letter-spacing:-2px;
}

.story-heading .red{
    color:#ff001f;
}

.brand p.para {
  max-width: 300px;
}

/* =====================================================
   TIMELINE AREA
===================================================== */

.story-timeline{
    position:relative;
    width: 870px;
    height:750px;
    margin:25px auto 0;
}


/* =====================================================
   CURVED LINE
===================================================== */

.story-curve{
    position:absolute;
    left:0;
    top:0;
    width: 100%;
    height: 731px;
    overflow:visible;
    z-index:1;
    pointer-events:none;
}


/* GREY LINE */

.story-curve .grey{
    fill:none;
    stroke:#4a4a4a;
    stroke-width:1;
    stroke-linecap:round;
    stroke-linejoin:round;
}


/* RED LINE */

.story-curve .red{
    fill:none;
    stroke:#ff001f;
    stroke-width:1;
    stroke-linecap:round;
    stroke-linejoin:round;
}


/* =====================================================
   DOT
===================================================== */

.story-dot{
    position:absolute;

    width:16px;
    height:16px;

    border-radius:50%;

    background:#ff001f;

    z-index:10;
}


/* =====================================================
   NUMBER
===================================================== */

.story-number{
    position:absolute;
    color:#777;
    font-size: 19px;
    font-weight:300;
    font-style:italic;
    z-index:10;
}


/* =====================================================
   CONTENT
===================================================== */

.story-content{
    position:absolute;
    z-index:10;
}

.story-content h2{
    margin:0 0 15px;
    color:#f5f5f5;
    font-size:30px;
    line-height:1;
    font-weight:700;
    letter-spacing:-.7px;
}

.story-content h3{
    margin:0 0 17px;
    color:#fff;
    font-size: 12px;
    line-height:1.1;
    font-weight: 600;
}

.story-content p{
    margin:0;
    color:#858585;
    font-size: 12px;
    line-height:1.45;
    font-weight:400;
}


/* =====================================================
   2005
===================================================== */

.story-2005{
    position:absolute;
    left: 553px;
    top: 167px;
    width:225px;
}

.story-2005 .story-dot{
    left:-48px;
    top:-22px;
}

.story-2005 .story-number{
    left:-49px;
    top:5px;
}


/* =====================================================
   2010
===================================================== */

.story-2010{
    position:absolute;
    left: 18px;
    top: 252px;
    width:190px;
}

.story-2010 .story-dot{
    left: 290px;
    top:42px;
}

.story-2010 .story-number{
    left: 289px;
    top: 9px;
}


/* =====================================================
   2015
===================================================== */

.story-2015{
    position:absolute;
    left: 444px;
    top: 377px;
    width:225px;
}

.story-2015 .story-dot{
    left:-72px;
    top:40px;
}

.story-2015 .story-number{
    left: -74px;
    top: 9px;
}


/* =====================================================
   2020+
===================================================== */

.story-2020{
    position:absolute;
    left: 300px;
    top: 591px;
    width:250px;
}

.story-2020 .story-dot{
    left:276px;
    top:-12px;
}

.story-2020 .story-number{
    left:276px;
    top:10px;
}


/* =====================================================
   TABLET
===================================================== */

@media(max-width:800px){

    .story-heading h1{
        font-size:42px;
    }

    .story-timeline{
        transform-origin:top center;
        transform:scale(.85);
        margin-bottom:-100px;
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media(max-width:600px){

    .story-section{
        min-height:auto;
        padding:50px 20px 80px;
    }

    .story-heading{
        margin-top:45px;
    }

    .story-heading h1{
        font-size:34px;
        line-height:1;
        letter-spacing:-1px;
    }

    .story-timeline{
        width:100%;
        height:auto;
        margin-top:65px;
        transform:none;
    }

    .story-curve{
        display:none;
    }

    /* mobile vertical timeline */

    .story-timeline::before{
        content:"";

        position:absolute;

        left:10px;
        top:0;
        bottom:0;

        width:1px;

        background:#3d3d3d;
    }

    .story-2005,
    .story-2010,
    .story-2015,
    .story-2020{

        position:relative;

        left:auto;
        top:auto;

        width:calc(100% - 35px);

        margin-left:35px;
        margin-bottom:75px;
    }

    .story-2005 .story-dot,
    .story-2010 .story-dot,
    .story-2015 .story-dot,
    .story-2020 .story-dot{

        left:-31px;
        right:auto;
        top:4px;

        width:13px;
        height:13px;
    }

    .story-2005 .story-number,
    .story-2010 .story-number,
    .story-2015 .story-number,
    .story-2020 .story-number{

        left:0;
        right:auto;
        top:-22px;
    }

    .story-content h2{
        font-size:29px;
    }

    .story-content p{
        max-width:280px;
        font-size:12px;
    }

}



.strategy-card2 {
    margin-top: 30px;
    margin-bottom: 80px;
}

.strategy-card2 .strategy-icon {
    font-family: 'Montserrat';
    font-size: 40px;
    font-weight: 700;
    height: auto !important;
    line-height: 35px;
    margin-bottom: 10px;
    padding-bottom: 15px;
    position: relative;
}

.strategy-card2 .strategy-icon:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 3px;
    /* margin: 12px 0 15px; */
    background: #ff001f;
    bottom: 0;
    left: 0;
}

.strategy-card2 h3 {
    font-size: 14px;
    text-transform: uppercase;
}

.strategy-card2 p {
    margin: 0;
    font-size: 14px;
}



/* =========================================
   RESET - ONLY INSIDE SECTION
========================================= */

.ow-brands,
.ow-brands * {
  box-sizing: border-box;
}

.ow-brands button,
.ow-brands img,
.ow-brands h2,
.ow-brands p {
  margin: 0;
}


/* =========================================
   MAIN SECTION
========================================= */

.ow-brands {
  width: 100%;
  background: #f8f8f8;
  padding: 80px 0;
  font-family: Arial, Helvetica, sans-serif;
  color: #111216;
  overflow: hidden;
}

.ow-brands-inner {
  width: calc(100% - 128px);
  max-width: 1200px;
  margin: 0 auto;
}


/* =========================================
   HEADING
========================================= */

.ow-brands-heading h2 {
  font-size: 60px;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -1.4px;
  color: #111216;
  font-family: 'Montserrat';
}

.ow-red-line {
  width: 25px;
  height: 3px;
  background: #ff0808;
  margin-top: 13px;
}

.ow-brands-heading p {
  font-size: 15px;
  line-height: 1.5;
  font-weight: 400;
  color: #777982;
  margin-top: 14px;
  margin-bottom: 24px;
  font-family: 'Montserrat';
}


/* =========================================
   CATEGORY TABS
========================================= */

.ow-tabs {
  width: 100%;
  height: 45px;
  display: flex;
  background: #ffffff;
  margin-bottom: 24px;
}

.ow-tab {
  position: relative;
  flex: 1 1 25%;
  min-width: 0;
  height: 44px;
  border: 0;
  border-radius: 0;
  background: #ffffff;
  color: #555555;
  font-family: 'Montserrat';
  font-size: 13px;
  font-weight: 400;
  padding: 0 5px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.ow-tab + .ow-tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  height: 28px;
  width: 1px;
  background: #e4e4e4;
}

.ow-tab.active {
  background: #ff0808;
  color: #ffffff;
  font-weight: 700;
}

.ow-tab.active::before,
.ow-tab.active + .ow-tab::before {
  display: none;
}


/* =========================================
   BRAND CARDS
========================================= */

.ow-cards {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.ow-brand-card {
  width: 100%;
  height: 260px;
  min-width: 0;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  overflow: hidden;
  padding-top: 10px;
}


/* Product image area */

.ow-product {
  width: 100%;
  height: 151px;
  padding: 13px 12px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ow-product img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
}


/* Brand logo */

.ow-logo {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ow-logo img {
  display: block;
  max-width: 100%;
  max-height: 42px;
  width: auto;
  height: auto;
  object-fit: contain;
}


/* Small red line */

.ow-card-line {
  display: block;
  width: 17px;
  height: 3px;
  background: #ff0808;
  margin-top: 10px;
  margin-bottom: 10px;
}


/* Category text */

.ow-brand-card p {
  color: #71717A;
  font-size: 8px;
  line-height: 1;
  font-weight: 600;
  font-family: 'Montserrat';
  font-size: 11px;
}


/* =========================================
   BOTTOM FOOTER
========================================= */

.ow-bottom {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 52px;
}

.ow-bottom-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ow-bottom-left > span {
  display: block;
  width: 28px;
  height: 2px;
  background: #ff0808;
}

.ow-bottom-left p {
  color: #5f6067;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  font-family: 'Montserrat';
}

.ow-bottom-right {
  display: flex;
  align-items: center;
  gap: 66px;
}

.ow-bottom-red {
  display: block;
  width: 16px;
  height: 2px;
  background: #ff0808;
}

.ow-counter {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #777982;
  font-size: 13px;
  line-height: 1;
  font-family: 'Montserrat';
}

.ow-counter b {
  color: #111216;
  font-weight: 700;
}


/* =========================================
   FOCUS
========================================= */

.ow-tab:focus-visible {
  outline: 2px solid #ff0808;
  outline-offset: 2px;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 900px) {

  .ow-brands-inner {
    width: calc(100% - 48px);
  }

  .ow-brands-heading h2 {
    font-size: 40px;
  }

  .ow-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ow-brand-card {
    height: 237px;
  }

  .ow-bottom-right {
    gap: 25px;
  }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 600px) {

  .ow-brands {
    padding: 35px 0 25px;
  }

  .ow-brands-inner {
    width: calc(100% - 32px);
  }

  .ow-brands-heading h2 {
    font-size: 34px;
    letter-spacing: -0.8px;
  }

  .ow-red-line {
    margin-top: 10px;
  }

  .ow-brands-heading p {
    font-size: 11px;
    margin-top: 13px;
    margin-bottom: 22px;
  }

  .ow-tabs {
    height: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 16px;
  }

  .ow-tab {
    height: 36px;
    min-height: 36px;
    font-size: 9px;
  }

  .ow-tab + .ow-tab::before {
    display: none;
  }

  .ow-tab:nth-child(odd) {
    border-right: 1px solid #eeeeee;
  }

  .ow-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .ow-brand-card {
    height: 225px;
  }

  .ow-product {
    height: 138px;
    padding: 10px 8px 0;
  }

  .ow-logo {
    height: 42px;
    padding: 0 8px;
  }

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

  .ow-brand-card p {
    font-size: 7px;
  }

  .ow-bottom {
    margin-top: 30px;
  }

  .ow-bottom-left {
    gap: 8px;
  }

  .ow-bottom-left > span {
    width: 22px;
  }

  .ow-bottom-left p {
    font-size: 7px;
  }

  .ow-bottom-right {
    gap: 15px;
  }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 380px) {

  .ow-brands-inner {
    width: calc(100% - 24px);
  }

  .ow-brands-heading h2 {
    font-size: 30px;
  }

  .ow-brand-card {
    height: 210px;
  }

  .ow-product {
    height: 125px;
  }

  .ow-bottom-left p {
    font-size: 6px;
  }

}



/* =========================================
   WHY CHOOSE US
========================================= */

.why-choose-us {
  width: 100%;
  background: #ffffff;
  padding: 60px 0 60px;
  font-family: Arial, Helvetica, sans-serif;
  color: #111216;
  overflow: hidden;
}

.why-container {
  width: calc(100% - 130px);
  max-width: 1200px;
  margin: 0 auto;
}

/* =========================================
   WHY CHOOSE US - CARD HOVER ANIMATION
========================================= */

.why-card {
  min-width: 0;
  height: 207px;
  background: #f7f7f7;
  padding: 25px 26px 20px;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;

  /* Smooth hover animation */
  transition:
    background-color 0.35s ease,
    color 0.35s ease,
    transform 0.35s ease;

  cursor: pointer;
}

/* Hover Background */
.why-card:hover {
  background-color: #0E1013;
}

/* Heading hover */
.why-card:hover h3 {
  color: #ffffff;
}

/* Paragraph hover */
.why-card:hover p {
  color: #A1A1AA;
}

/* Fourth card default dark */
.why-dark-card {
  background: #0E1013;
}

/* Dark card text */
.why-dark-card h3 {
  color: #ffffff;
}

.why-dark-card p {
  color: #85868c;
}
/* =========================================
   HEADING
========================================= */

.why-heading {
  text-align: center;
  margin-bottom: 32px;
}

.why-eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-bottom: 14px;
}

.why-eyebrow span {
  display: block;
  width: 27px;
  height: 2px;
  background: #ff0808;
}

.why-eyebrow strong {
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
  color: #ff0808;
  font-family: 'Montserrat';
}

.why-heading h2 {
  margin: 0;
  font-size: 60px;
  line-height: 1.1;
  font-weight: 600;
  letter-spacing: -1px;
  color: #111216;
  font-family: 'Montserrat';
}

.why-heading-line {
  width: 25px;
  height: 3px;
  background: #ff0808;
  margin: 13px auto 0;
  border-radius: 2px;
}

.why-heading p {
  margin: 19px 0 0;
  color: #71717A;
  font-size: 11px;
  line-height: 1.5;
  font-weight: 400;
  font-family: 'Montserrat';
  font-size: 15px;
}


/* =========================================
   CARDS GRID
========================================= */

.why-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.why-card {
  min-width: 0;
  height: 270px;
  background: #f7f7f7;
  padding: 25px 26px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

.why-dark-card {
  background: #101316;
}


/* =========================================
   ICONS
========================================= */

.why-icon {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.why-icon svg {
  width: 30px;
  height: 30px;
  color: #ffffff;
}

.red-icon {
  background: #ff0808;
}

.black-icon {
  background: #101316;
}


/* =========================================
   CARD CONTENT
========================================= */

.why-card h3 {
  margin: 14px 0 0;
  color: #111216;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -0.15px;
  font-family: 'Montserrat';
}

.why-dark-card h3 {
  color: #ffffff;
}

.why-card-line {
  width: 22px;
  height: 2px;
  background: #ff0808;
  margin-top: 9px;
  margin-bottom: 8px;
  flex-shrink: 0;
}

.why-card p {
  margin: 0;
  color: #777982;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 400;
  font-family: 'Montserrat';
}

.why-dark-card p {
  color: #85868c;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1000px) {

  .why-container {
    width: calc(100% - 48px);
  }

  .why-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  .why-card {
    height: auto;
    min-height: 220px;
  }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 600px) {

  .why-choose-us {
    padding: 35px 0 35px;
  }

  .why-container {
    width: calc(100% - 32px);
  }

  .why-heading {
    margin-bottom: 28px;
  }

  .why-heading h2 {
    font-size: 32px;
    letter-spacing: -0.7px;
  }

  .why-heading p {
    font-size: 11px;
    line-height: 1.6;
    margin-top: 17px;
  }

  .why-desktop {
    display: none;
  }

  .why-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .why-card {
    min-height: 0;
    height: auto;
    padding: 24px 25px 25px;
  }

  .why-card h3 {
    font-size: 14px;
  }

  .why-card p {
    font-size: 10px;
    line-height: 1.6;
  }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 380px) {

  .why-heading h2 {
    font-size: 29px;
  }

  .why-card {
    padding: 22px 20px 23px;
  }

}


/* =========================================
   VISION SECTION
========================================= */

.vision-section {
    width: 100%;
    background: #050505;
    color: #fff;
    padding: 70px 0 70px;
    overflow: hidden;
}

.vision-container {
    width: min(100% - 110px, 1170px);
    margin: 0 auto;
}


/* =========================================
   TOP AREA
========================================= */

.vision-top {
    display: grid;
    grid-template-columns: 1fr 502px;
    align-items: center;
    gap: 55px;
    margin-bottom: 48px;
}

.vision-content {
    max-width: 650px;
}


/* LABEL */

.vision-label {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 18px;
}

.vision-label span {
    color: #ff1515;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
    white-space: nowrap;
    font-family: 'Montserrat';
}

.vision-label i {
    width: 72px;
    height: 1px;
    background: #ff1515;
    display: block;
}


/* HEADING */

.vision-content h2 {
    margin: 0 0 18px;
    font-size: clamp(42px, 4vw, 58px);
    line-height: 
65px;
    font-weight: 600;
    letter-spacing: -1.8px;
    font-family: 'Montserrat';
}

.vision-content h2 span {
    color: #ff1010;
}


/* DESCRIPTION */

.vision-content > p {
    max-width: 650px;
    margin: 0;
    color: #858585;
    font-size: 14px;
    line-height: 1.55;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =========================================
   IMAGE
========================================= */

.vision-image {
    width: 100%;
    height: 254px;
    position: relative;
    overflow: hidden;

    /* makes image fade into black */
    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0%,
        #000 20%,
        #000 80%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to right,
        transparent 0%,
        #000 20%,
        #000 80%,
        transparent 100%
    );
}

.vision-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;

    filter: saturate(0.8);
}


/* =========================================
   CARDS
========================================= */

.vision-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 17px;
}

.vision-card {
    min-height: 316px;
    border: 1px solid #2c2c2c;
    background: #090a0b;
    padding: 22px 23px 25px;
    display: flex;
    flex-direction: column;
    transition:
        border-color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
    /* justify-content: center; */
    padding-top: 30px;
}

.vision-card:hover {
    border-color: #ff1515;
    background: #0d0d0e;
    transform: translateY(-4px);
}


/* =========================================
   CARD TOP
========================================= */

.card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}


/* ICON */

.card-icon {
    width: 51px;
    height: 51px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.card-icon img {
    width: 60px;
    height: 60px;
}


/* NUMBER */

.card-number {
    font-size: 25px;
    font-weight: 600;
    line-height: 41px;
    color: #fff;
}


/* =========================================
   CARD CONTENT
========================================= */

.card-content {
    margin-top: 40px;
    padding-top: 0;
}

.card-content h3 {
    margin: 0 0 8px;
    color: #f5f5f5;
    font-size: 19px;
    line-height: 1.15;
    font-weight: 600;
    letter-spacing: -0.2px;
    font-family: 'Montserrat';
    min-height: 43px;
    display: flex;
    align-items: center;
}

.card-content p {
    margin: 0;
    color: #7d7d7d;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1000px) {

    .vision-container {
        width: min(100% - 50px, 900px);
    }

    .vision-top {
        grid-template-columns: 1fr 300px;
        gap: 30px;
    }

    .vision-content h2 {
        font-size: 43px;
    }

    .vision-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .vision-card {
        min-height: 240px;
    }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 650px) {

    .vision-section {
        padding: 55px 0 35px;
    }

    .vision-container {
        width: calc(100% - 35px);
    }

    .vision-top {
        display: flex;
        flex-direction: column;
        gap: 30px;
        margin-bottom: 35px;
    }

    .vision-content {
        width: 100%;
    }

    .vision-content h2 {
        font-size: 39px;
        letter-spacing: -1.2px;
    }

    .vision-content > p {
        font-size: 11px;
        line-height: 1.6;
    }

    .vision-image {
        width: 100%;
        height: 190px;
    }

    .vision-cards {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .vision-card {
        min-height: 220px;
        padding: 20px;
    }

    .card-content {
        padding-top: 30px;
    }
}



/* =========================================
   BIOGRAPHY & LEADERSHIP JOURNEY
========================================= */

.bio-section {
    width: 100%;
    background: #ffffff;
    color: #102039;
    padding: 60px 0 60px;
    font-family: Arial, Helvetica, sans-serif;
    box-sizing: border-box;
}

.bio-section *,
.bio-section *::before,
.bio-section *::after {
    box-sizing: border-box;
}

.bio-container {
    width: calc(100% - 80px);
    max-width: 1200px;
    margin: 0 auto;
}


/* =========================================
   TOP AREA
========================================= */

.bio-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 240px 240px;
    column-gap: 42px;
    align-items: start;
}


/* =========================================
   LABEL
========================================= */

.bio-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}

.bio-label-line {
    width: 17px;
    height: 1px;
    background: #ff1111;
}

.bio-label span {
    color: #53647b;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .2px;
    font-family: 'Montserrat';
}


/* =========================================
   HEADING
========================================= */

.bio-heading {
    margin: 0;
    font-size: 60px;
    line-height: 1.05;
    letter-spacing: -1.3px;
    font-weight: 600;
    color: #102039;
}

.bio-heading span {
    color: #ff1010;
}


/* =========================================
   DESCRIPTION
========================================= */

.bio-description {
    max-width: 570px;
    margin: 24px 0 0;
    color: #475569;
    font-size: 14px;
    line-height: 1.55;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =========================================
   QUOTE
========================================= */

.bio-quote {
    padding-top: 48px;
}

.bio-quote-mark {
    color: #ff1010;
    font-size: 36px;
    line-height: .5;
    font-weight: 800;
    margin-bottom: 22px;
}

.bio-quote-text {
    margin: 0;
    color: #617188;
    font-size: 13px;
    line-height: 1.5;
    font-family: 'Montserrat';
}

.bio-quote-author {
    margin-top: 12px;
    color: #ff1010;
    font-size: 13px;
    font-weight: 700;
    font-family: 'Montserrat';
}

.bio-quote-role {
    margin-top: 0px;
    color: #53647b;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Montserrat';
}


/* =========================================
   PROFILE CARD
========================================= */

.bio-profile {
    width: 100%;
    background: #f1f5f8;
}

.bio-profile-image {
    width: 100%;
    height: 221px;
    overflow: hidden;
}

.bio-profile-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.bio-profile-info {
    min-height: 47px;
    padding: 10px 10px 9px;
    border-left: 2px solid #ff1010;
}

.bio-profile-name {
    margin: 0;
    color: #102039;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 800;
    text-transform: uppercase;
    font-family: 'Montserrat';
}

.bio-profile-title {
    margin: 4px 0 0;
    color: #53647b;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;
    font-family: 'Montserrat';
}


/* =========================================
   TIMELINE
========================================= */

.bio-timeline {
    position: relative;
    margin-top: 70px;
}


/* horizontal line */

.bio-timeline-line {
    position: absolute;
    left: 0;
    right: 0;
    top: 32px;
    height: 1px;
    background: #dce3eb;
}


/* YEARS */

.bio-years {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

.bio-year {
    position: relative;
    text-align: center;
}

.bio-year-number {
    display: block;
    color: #17263d;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 13px;
    font-family: 'Montserrat';
    font-weight: 600;
}

.bio-year:last-child .bio-year-number {
    color: #ff1010;
}


/* timeline circles */

.bio-dot {
    position: relative;
    z-index: 2;

    width: 14px;
    height: 14px;

    margin: 0 auto;

    border: 3px solid #ff1010;
    background: #fff;
    border-radius: 50%;
}

.bio-dot::after {
    content: "";
    position: absolute;

    width: 4px;
    height: 4px;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    background: #ff1010;
    border-radius: 50%;
}


/* =========================================
   JOURNEY CARDS
========================================= */

.bio-cards {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 17px;
    margin-top: 28px;
}

.bio-card {
    min-height: 180px;
    padding: 18px 17px 17px;

    border: 1px solid #e1e7ed;
    background: #ffffff;

    box-shadow: 0 5px 15px rgba(16, 32, 57, 0.035);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}

.bio-card:hover {
    transform: translateY(-4px);
    border-color: #d4dce5;
    box-shadow: 0 10px 25px rgba(16, 32, 57, 0.08);
}

.bio-card h3 {
    margin: 0 0 12px;
    color: #18283e;
    font-size: 14px;
    line-height: 1.15;
    font-weight: 600;
    font-family: 'Montserrat';
}

.bio-card p {
    margin: 0;
    color: #617188;
    font-size: 13px;
    line-height: 1.55;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 950px) {

    .bio-container {
        width: calc(100% - 50px);
    }

    .bio-top {
        grid-template-columns: minmax(0, 1fr) 160px;
        gap: 30px;
    }

    .bio-quote {
        display: none;
    }

    .bio-heading {
        font-size: 36px;
    }

    .bio-profile-image {
        height: 175px;
    }

    .bio-cards {
        grid-template-columns: repeat(3, 1fr);
    }

    .bio-year:nth-child(4),
    .bio-year:nth-child(5) {
        display: none;
    }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 650px) {

    .bio-section {
        padding: 45px 0 35px;
    }

    .bio-container {
        width: calc(100% - 30px);
    }

    .bio-top {
        display: flex;
        flex-direction: column;
        gap: 30px;
    }

    .bio-heading {
        font-size: 34px;
        letter-spacing: -1px;
    }

    .bio-description {
        font-size: 11px;
        max-width: 100%;
    }

    .bio-quote {
        display: block;
        padding-top: 0;
        max-width: 300px;
    }

    .bio-profile {
        width: 180px;
        align-self: flex-end;
    }

    .bio-profile-image {
        height: 190px;
    }

    .bio-timeline {
        margin-top: 55px;
        overflow-x: auto;
        padding-bottom: 8px;
    }

    .bio-timeline-line {
        width: 700px;
        right: auto;
    }

    .bio-years {
        width: 700px;
        grid-template-columns: repeat(5, 1fr);
    }

    .bio-year:nth-child(4),
    .bio-year:nth-child(5) {
        display: block;
    }

    .bio-cards {
        width: 700px;
        grid-template-columns: repeat(5, 1fr);
        gap: 12px;
    }

    .bio-card {
        min-height: 180px;
    }
}



.impact{background:#000;overflow:hidden}

/* poora section ek fixed ratio canvas (1016 x 593) */
.canvas{
  position:relative;
  width:100%;
  max-width:1600px;
  margin:0 auto;
  aspect-ratio:1016/593;
  container-type:inline-size;
}

/* globe image */
.globe{
  position:absolute;
  left:50%;
  top:19.5%;
  transform:translateX(-50%);
  width:61%;
  height:auto;
  z-index:1;
  pointer-events:none;
  user-select:none;
}

/* heading */
.eyebrow{
  position:absolute;
  top:8.5%;
  left:0;
  right:0;
  z-index:3;
  text-align:center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform:uppercase;
  color: #A1A1A1;
  font-family: 'Montserrat';
}
.title{
  position:absolute;
  top:11.8%;
  left:0;
  right:0;
  z-index:3;
  text-align:center;
  font-size: 60px;
  font-weight:600;
  letter-spacing:-.01em;
  line-height:1.1;
  color: #fff;
  font-family: 'Montserrat';
}
.title .hl{color:var(--red)}

/* region cards */
.pin{
  position:absolute;
  z-index:3;
  width: 250px;
  background:var(--card-bg);
  color:var(--card-text);
  border-radius:.35cqw;
  padding:.85cqw 1cqw .95cqw 2.1cqw;
  box-shadow:0 .8cqw 2cqw rgba(0,0,0,.5);
  background-color: #ffffffde;
}
.pin::before{
  content:"";
  position:absolute;
  left:.95cqw;
  top: 16px;
  width:.5cqw;
  height:.5cqw;
  border-radius:50%;
  background: #ff0000;
}
.pin h3{
  font-size:.78cqw;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  margin-bottom:.35cqw;
  font-family: 'Montserrat';
}
.pin p{
  font-size: 11px;
  font-weight:400;
  line-height:1.5;
  color:var(--card-muted);
  margin: 0;
  font-family: 'Montserrat';
}

.p-na{left:21.4%;top:38.2%}
.p-eu{left:45.8%;top:29.8%}
.p-as{left:73.2%;top:45.1%}
.p-la{left:23.4%;top:58.3%}
.p-me{left:56.9%;top:58.8%}

/* stats bar */
.stats{
  position:absolute;
  z-index:4;
  left:5.9%;
  right:6%;
  top:74%;
  bottom:8%;
  background: #19191980;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  align-items:start;
  padding: 20px 50px;
  border: 1px solid;
}
.stat{position:relative;padding:0 1.8cqw;border-left: 1px solid #cccccc21;min-height: 108px;display: flex;flex-direction: column;justify-content: center;}
.stat + .stat::before{
  content:"";
  position:absolute;
  left:0;top:.2cqw;bottom:-.6cqw;
  width:1px;
  background:var(--line);
}
.top{display:flex;align-items:baseline;gap:.5cqw;margin-bottom: 11px;}
.num{font-size:2.9cqw;font-weight:600;line-height:1;letter-spacing:-.02em;font-family: 'Montserrat';color: #fff;}
.unit{color: #ff0000;font-size: 13px;font-weight:600;position: absolute;top: 0;left: 92px;font-family: 'Montserrat';}
.label{font-size: 15px;font-weight:400;color:#f3f3f3;font-family: 'Montserrat';}
.dot{
  width:.35cqw;height:.35cqw;
  border-radius:50%;
  background:var(--red);
  align-self:flex-start;
  margin:.15cqw 0 0 -.35cqw;
}
.desc{
  margin-top:1cqw;
  font-size: 10px;
  line-height:1.65;
  letter-spacing:.04em;
  text-transform:uppercase;
  color: #9A9A9A;
  margin: 0;
  font-family: 'Montserrat';
}

/* mobile / tablet */
@media (max-width:820px){
  .canvas{aspect-ratio:auto;padding:34px 20px 30px;container-type:normal}
  .eyebrow,.title,.pin,.stats,.globe{position:static;transform:none}
  .eyebrow{font-size:11px;margin-bottom:10px}
  .title{font-size:clamp(24px,7vw,36px);margin-bottom:18px}
  .globe{width:100%;max-width:440px;margin:0 auto;display:block}
  .pins{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-top:22px}
  .pin{width:auto;border-radius:4px;padding:12px 14px 13px 26px;box-shadow:none}
  .pin::before{left:12px;top:17px;width:6px;height:6px}
  .pin h3{font-size:11px;margin-bottom:5px}
  .pin p{font-size:11px}
  .stats{margin-top:24px;grid-template-columns:repeat(2,1fr);gap:22px 0;padding:24px 8px}
  .stat{padding:0 16px}
  .stat + .stat::before{display:none}
  .stat:nth-child(even){border-left:1px solid var(--line)}
  .num{font-size:28px}.unit{font-size:14px}.label{font-size:13px}
  .dot{width:4px;height:4px;margin:2px 0 0 -3px}
  .desc{margin-top:8px;font-size:9.5px}
}
@media (max-width:480px){
  .stats{grid-template-columns:1fr}
  .stat:nth-child(even){border-left:0}
}


span.hl {
    color: #E7000B !important;
}


/* ================================
   MARKETS SECTION
================================ */

.markets-section {
    width: 100%;
    box-sizing: border-box;
    padding: 60px 4.35% 60px;
    background: #ffffff;
    /* border-top: 2px solid #171717; */
    font-family: Arial, Helvetica, sans-serif;
    color: #111116;
}

.markets-container {
    max-width: 1170px;
    margin: 0 auto;
}

/* ================================
   TOP CONTENT
================================ */

.markets-top {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 45px;
    align-items: end;
    margin-bottom: 47px;
}

/* Left Side */

.markets-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 13px;
}

.markets-label-line {
    width: 24px;
    height: 3px;
    background: #ff1025;
    display: block;
}

.markets-label-text {
    font-size: 13px;
    line-height: 1;
    font-weight: 700;
    color: #55555d;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    font-family: 'Montserrat';
}

.markets-heading {
    margin: 0;
    padding: 0;
    font-size: 60px;
    line-height: 0.92;
    letter-spacing: -1.8px;
    font-weight: 800;
    font-family: 'Montserrat';
}

.markets-heading span {
    display: block;
    color: #ff1025;
}

.markets-description {
    max-width: 545px;
    margin: 16px 0 0;
    font-size: 15px;
    line-height: 1.65;
    color: #74747c;
    font-weight: 400;
    font-family: 'Montserrat';
}

/* ================================
   STATS
================================ */

.markets-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    align-items: end;
}

.market-stat {
    text-align: center;
}

.market-stat-icon {
    width: 30px;
    height: 30px;
    margin: 0 auto 12px;
    color: #ff1025;
    display: flex;
    align-items: center;
    justify-content: center;
}

.market-stat-icon svg {
    width: 25px;
    height: 25px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.4;
}

.market-stat-number {
    font-size: 28px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.5px;
    color: #16161b;
    font-family: 'Montserrat';
}

.market-stat-title {
    margin-top: 9px;
    font-size: 10px;
    line-height: 1;
    color: #67676f;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    font-family: 'Montserrat';
}

/* ================================
   MARKET CARDS
================================ */

.markets-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 13px;
}

.market-card {
    position: relative;
    height: 410px;
    overflow: hidden;
    background: #222;
    cursor: pointer;
}

.market-card-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.65s cubic-bezier(.2,.7,.2,1);
}

/* Images */

.market-card:nth-child(1) .market-card-bg {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/ds-global-img1.jpg");
}

.market-card:nth-child(2) .market-card-bg {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/ds-global-img2.jpg");
}

.market-card:nth-child(3) .market-card-bg {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/ds-global-img3.jpg");
}

.market-card:nth-child(4) .market-card-bg {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/ds-global-img4.jpg");
}

/* Dark overlay */

.market-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,0.03) 20%,
            rgba(0,0,0,0.12) 48%,
            rgba(0,0,0,0.78) 100%
        );
    z-index: 1;
}

/* Card content */

.market-card-content {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 17px;
    z-index: 2;
    color: #fff;
}

.market-card-title {
    margin: 0 0 7px;
    font-size: 16px;
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.2px;
    font-family: 'Montserrat';
}

.market-card-countries {
    margin: 0;
    font-size: 10px;
    line-height: 1;
    font-weight: 600;
    text-transform: uppercase;
    color: rgba(255,255,255,0.92);
    font-family: 'Montserrat';
}

/* Arrow */

.market-card-arrow {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 27px;
    height: 27px;
    border: 1px solid rgba(255,255,255,0.95);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.market-card-arrow svg {
    width: 14px;
    height: 14px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.7;
}

/* Hover */

.market-card:hover .market-card-bg {
    transform: scale(1.07);
}

.market-card:hover .market-card-arrow {
    background: #ffffff;
    color: #111116;
    transform: translateX(2px);
}


/* ================================
   TABLET
================================ */

@media (max-width: 900px) {

    .markets-section {
        padding: 50px 5%;
    }

    .markets-top {
        grid-template-columns: 1fr;
        gap: 35px;
        margin-bottom: 40px;
    }

    .markets-stats {
        max-width: 600px;
    }

    .markets-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    .market-card {
        height: 300px;
    }
}


/* ================================
   MOBILE
================================ */

@media (max-width: 600px) {

    .markets-section {
        padding: 42px 20px;
    }

    .markets-heading {
        font-size: 38px;
        letter-spacing: -1.4px;
    }

    .markets-description {
        font-size: 12px;
        line-height: 1.6;
    }

    .markets-stats {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 28px;
    }

    .markets-cards {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .market-card {
        height: 280px;
    }
}


/* ================================
   SMALL MOBILE
================================ */

@media (max-width: 380px) {

    .markets-heading {
        font-size: 34px;
    }

    .market-card {
        height: 260px;
    }
}


/* =========================================
   GLOBAL IMPACT SECTION
========================================= */

.gi-section {
    width: 100%;
    box-sizing: border-box;
    background: #08090b;
    color: #ffffff;
    padding: 72px 5.55% 110px;
    font-family: Arial, Helvetica, sans-serif;
}

.gi-container {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
}


/* =========================================
   TOP LABEL
========================================= */

.gi-label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
}

.gi-label-line {
    width: 32px;
    height: 3px;
    background: #ff1025;
    display: block;
    border-radius: 2px;
}

.gi-label-text {
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
    color: #929297;
    text-transform: uppercase;
    letter-spacing: -0.2px;
    font-family: 'Montserrat';
}


/* =========================================
   HEADING
========================================= */

.gi-heading {
    margin: 0;
    padding: 0;
    font-size: clamp(48px, 4.25vw, 60px);
    line-height: 1.05;
    letter-spacing: -2px;
    font-weight: 600;
    color: #f7f7f8;
    font-family: 'Montserrat';
}

.gi-heading span {
    color: #ff1025;
    font-weight: 700;
}


/* =========================================
   DESCRIPTION
========================================= */

.gi-description {
    margin: 22px 0 0;
    max-width: 760px;
    color: #929297;
    font-size: 15px;
    line-height: 1.55;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =========================================
   CARDS
========================================= */

.gi-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 17px;
    margin-top: 50px;
}

.gi-card {
    position: relative;
    min-height: 213px;
    box-sizing: border-box;
    padding: 25px 24px 23px;
    background: #101115;
    border: 1px solid #202126;
    overflow: hidden;
    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        background 0.35s ease;
}


/* subtle hover glow */

.gi-card::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #ff1025;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
}

.gi-card:hover {
    transform: translateY(-5px);
    border-color: #35363d;
    background: #121318;
}

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


/* =========================================
   ICON
========================================= */

.gi-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255, 16, 37, 0.13);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
}

.gi-icon svg {
    width: 19px;
    height: 19px;
    stroke: #ff1025;
    fill: none;
    stroke-width: 1.4;
}


/* =========================================
   NUMBER
========================================= */

.gi-number {
    margin: 0;
    font-size: 37px;
    line-height: 1;
    letter-spacing: -1.8px;
    font-weight: 800;
    color: #ffffff;
    font-family: 'Montserrat';
}


/* =========================================
   CARD TITLE
========================================= */

.gi-card-title {
    margin: 10px 0 0;
    font-size: 11px;
    line-height: 1;
    font-weight: 800;
    color: #ffffff;
    text-transform: uppercase;
    font-family: 'Montserrat';
}


/* =========================================
   CARD DESCRIPTION
========================================= */

.gi-card-description {
    margin: 7px 0 0;
    max-width: 100%;
    font-size: 11.5px;
    line-height: 1.35;
    color: #85858c;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1000px) {

    .gi-section {
        padding: 65px 5% 80px;
    }

    .gi-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .gi-card {
        min-height: 220px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 600px) {

    .gi-section {
        padding: 50px 20px 65px;
    }

    .gi-label {
        margin-bottom: 20px;
    }

    .gi-label-line {
        width: 27px;
        height: 3px;
    }

    .gi-label-text {
        font-size: 11px;
    }

    .gi-heading {
        font-size: 39px;
        line-height: 1.05;
        letter-spacing: -1.3px;
    }

    .gi-description {
        margin-top: 17px;
        font-size: 13px;
        line-height: 1.55;
    }

    .gi-cards {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: 35px;
    }

    .gi-card {
        min-height: 205px;
        padding: 23px 21px;
    }

    .gi-icon {
        margin-bottom: 23px;
    }

    .gi-number {
        font-size: 34px;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 380px) {

    .gi-heading {
        font-size: 34px;
    }

    .gi-card {
        min-height: 195px;
    }

}


/* =========================================================
   EXPANSION JOURNEY
========================================================= */

.ej-section {
    width: 100%;
    box-sizing: border-box;
    background: #ffffff;
    color: #111216;
    padding: 55px 4.8% 75px;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
}

.ej-container {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
}


/* =========================================================
   HEADER
========================================================= */

.ej-header {
    text-align: center;
    margin-bottom: 40px;
}

.ej-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-bottom: 22px;
}

.ej-label-line {
    width: 19px;
    height: 3px;
    background: #ff1025;
    border-radius: 3px;
}

.ej-label-text {
    font-size: 13px;
    font-weight: 600;
    color: #85858a;
    text-transform: uppercase;
    font-family: 'Montserrat';
}

.ej-title {
    margin: 0;
    font-size: 60px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -2px;
    font-family: 'Montserrat';
}

.ej-title span {
    color: #ff1025;
    font-weight: 700;
}

.ej-intro {
    max-width: 760px;
    margin: 27px auto 0;
    font-size: 15px;
    line-height: 1.65;
    color: #727279;
    font-family: 'Montserrat';
}

.ej-keywords {
    margin-top: 23px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.ej-keyword {
    font-size: 8px;
    font-weight: 600;
    color: #85858a;
    text-transform: uppercase;
    font-family: 'Montserrat';
    font-size: 11px;
}

.ej-x {
    color: #ff1025;
    font-size: 10px;
    font-weight: 900;
}


/* =========================================================
   TIMELINE
========================================================= */

.ej-timeline {
    position: relative;
    width: 100%;
    margin-bottom: 42px;
}

.ej-line {
    position: absolute;
    left: 0;
    right: 0;
    top: 34px;
    height: 2px;
    background: #dfe1e5;
    z-index: 0;
}

.ej-years {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    z-index: 2;
}

.ej-year {
    text-align: center;
}

.ej-year-number {
    display: block;
    font-size: 15px;
    line-height: 1;
    font-weight: 800;
    margin-bottom: 7px;
    font-family: 'Montserrat';
}

.ej-dot {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin: 0 auto;
    background: #ffe5e8;
    position: relative;
}

.ej-dot::after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ff1025;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* =========================================================
   JOURNEY CARDS
========================================================= */

.ej-cards {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 15px;
}

.ej-card {
    background: #F7F8FA;
    border: 1px solid #E5E5E5;
    padding: 14px;
    box-sizing: border-box;
    min-width: 0;
    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}

.ej-card:hover {
    transform: translateY(-6px);
    border-color: #d4d5d8;
    box-shadow: 0 15px 35px rgba(0,0,0,.08);
}


/* =========================================================
   CARD IMAGE
========================================================= */

.ej-image {
    width: 100%;
    height: 118px;
    overflow: hidden;
    background: #ddd;
}

.ej-image div {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    filter: grayscale(100%);
    transition:
        transform .6s ease,
        filter .6s ease;
}

.ej-card:hover .ej-image div {
    transform: scale(1.06);
    filter: grayscale(60%);
}


/* Images */

.ej-card:nth-child(1) .ej-image div {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/journey-img1.jpg");
}

.ej-card:nth-child(2) .ej-image div {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/journey-img2.jpg");
}

.ej-card:nth-child(3) .ej-image div {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/journey-img3.jpg");
}

.ej-card:nth-child(4) .ej-image div {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/journey-img4.jpg");
}

.ej-card:nth-child(5) .ej-image div {
    background-image: url("https://rarholding.com/wp-content/uploads/2026/10/journey-img5.jpg");
}


/* =========================================================
   CARD CONTENT
========================================================= */

.ej-card-heading {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 16px;
}

.ej-card-icon {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #ff1025;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ej-card-icon svg {
    width: 15px;
    height: 15px;
    stroke: #ffffff;
    fill: none;
    stroke-width: 1.5;
}

.ej-card-title {
    margin: 0;
    font-size: 13px;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: 'Montserrat';
}

.ej-card-description {
    margin: 11px 0 2px;
    font-size: 12px;
    line-height: 1.45;
    color: #74757b;
    min-height: 65px;
    font-family: 'Montserrat';
}


/* =========================================================
   BOTTOM STATISTICS
========================================================= */

.ej-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    border-top: 1px solid #e1e2e4;
    margin-top: 41px;
    padding-top: 42px;
}

.ej-stat {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 0 28px;
    border-right: 1px solid #e1e2e4;
}

.ej-stat:first-child {
    padding-left: 0;
}

.ej-stat:last-child {
    border-right: none;
}

.ej-stat-icon {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #fff0f2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ej-stat-icon svg {
    width: 21px;
    height: 21px;
    stroke: #ff1025;
    fill: none;
    stroke-width: 1.35;
}

.ej-stat-number {
    font-size: 31px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -1.5px;
    font-family: 'Montserrat';
}

.ej-stat-title {
    margin-top: 6px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    font-family: 'Montserrat';
}

.ej-stat-description {
    margin-top: 4px;
    font-size: 10px;
    color: #999a9e;
    text-transform: uppercase;
    font-family: 'Montserrat';
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .ej-section {
        padding-left: 4%;
        padding-right: 4%;
    }

    .ej-cards {
        grid-template-columns: repeat(3, 1fr);
    }

    .ej-card:nth-child(4),
    .ej-card:nth-child(5) {
        margin-top: 0;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

    .ej-section {
        padding: 45px 20px 60px;
    }

    .ej-header {
        margin-bottom: 48px;
    }

    .ej-title {
        font-size: 40px;
        letter-spacing: -1.3px;
    }

    .ej-intro {
        font-size: 12px;
        line-height: 1.6;
        margin-top: 20px;
    }

    .ej-keywords {
        gap: 9px;
    }

    .ej-keyword {
        font-size: 7px;
    }

    /* Horizontal timeline */

    .ej-timeline {
        overflow: hidden;
    }

    .ej-years {
        min-width: 700px;
    }

    .ej-line {
        min-width: 700px;
    }

    /* Horizontal cards */

    .ej-cards {
        display: flex;
        overflow-x: auto;
        gap: 12px;
        padding-bottom: 8px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .ej-cards::-webkit-scrollbar {
        display: none;
    }

    .ej-card {
        flex: 0 0 270px;
        scroll-snap-align: start;
    }

    .ej-bottom {
        grid-template-columns: 1fr;
        gap: 25px;
        padding-top: 30px;
    }

    .ej-stat {
        padding: 0;
        border-right: none;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 400px) {

    .ej-title {
        font-size: 35px;
    }

    .ej-card {
        flex-basis: 255px;
    }

    .ej-stat-number {
        font-size: 28px;
    }

}


.latest-news {
  width: 100%;
  padding: 55px 0 65px;
  background: #fff;
  overflow: hidden;
}

.news-wrapper {
  width: 1170px;
  margin: auto;
  position: relative;
}

.news-main-title {
  margin: 0 0 50px;
  color: #11162b;
  font-family: 'Montserrat';
  font-size: 40px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -1px;
}


/* SLIDER */

.news-slider {
  width: 100%;
  overflow: hidden;
}

.news-track {
  display: flex;
  width: 100%;

  transition: transform 0.7s cubic-bezier(.77,0,.18,1);
}

.news-slide {
  flex: 0 0 100%;
  width: 100%;

  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 44px;

  align-items: center;
}


/* IMAGE */

.news-image {
  width: 100%;
  height: 526px;
  overflow: hidden;
}

.news-image img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;
}


/* CONTENT */

.news-info {
  max-width: 560px;
}

.news-category {
  display: block;
  margin-bottom: 27px;
  color: #ff0012;
  font-family: 'Montserrat';
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
}


/* TITLE */

.news-info h3 {
  margin: 0 0 22px;
  color: #11162b;
  font-family: 'Montserrat';
  font-size: 45px;
  font-weight: 700;
  line-height: 50px;
  letter-spacing: -1.5px;
}


/* DESCRIPTION */

.news-info p {
  margin: 0 0 50px;
  color: #59657d;
  font-family: 'Montserrat';
  font-size: 15px;
  line-height: 1.65;
}


/* BUTTON */

.news-btn {
  display: inline-flex;

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

  min-width: 167px;
  height: 44px;

  padding: 0 20px;

  background: #ff0012;
  color: #fff;

  text-decoration: none;

  font-family: "Poppins", sans-serif;
  font-size: 11px;
  font-weight: 700;

  letter-spacing: 1.5px;

  transition: .25s ease;
}

.news-btn:hover {
  background: #d9000f;
}


/* DOTS */

.news-dots {
  display: flex;
  gap: 9px;
  margin-top: 35px;
  position: absolute;
  /* top: 2px; */
  right: 38%;
  /* width: 100%; */
  /* z-index: 9999; */
  bottom: 20px;
}

.news-dot {
  width: 11px;
  height: 11px;

  padding: 0;
  border: none;
  border-radius: 50%;

  background: #050505;

  cursor: pointer;
}

.news-dot.active {
  background: #ff0012;
}


/* TABLET */

@media (max-width: 1100px) {

  .news-wrapper {
    width: 92%;
  }

  .news-slide {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }

  .news-image {
    height: 450px;
  }

  .news-info h3 {
    font-size: 36px;
  }

}


/* MOBILE */

@media (max-width: 767px) {

  .latest-news {
    padding: 40px 0 50px;
  }

  .news-wrapper {
    width: calc(100% - 40px);
  }

  .news-main-title {
    margin-bottom: 30px;
    font-size: 34px;
  }

  .news-slide {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .news-image {
    height: 300px;
  }

  .news-info h3 {
    font-size: 30px;
    line-height: 1.25;
  }

  .news-info p {
    margin-bottom: 30px;
    font-size: 14px;
  }

}



/* =====================================================
   NEWS & INSIGHTS
===================================================== */

.ni-section {
    width: 100%;
    background: #ffffff;
    padding: 40px 0 80px;
    font-family: "Poppins", Arial, sans-serif;
    color: #171821;
}

.ni-container {
    width: 1170px;
    margin: 0 auto;
}


/* =====================================================
   HEADER
===================================================== */

.ni-label {
    display: inline-flex;
    align-items: center;

    padding: 5px 10px;

    background: #fff0f1;
    color: #ff0015;

    border-radius: 3px;

    font-size: 10px;
    font-weight: 700;
    line-height: 1;

    letter-spacing: .4px;
    text-transform: uppercase;

    margin-bottom: 15px;
}

.ni-heading {
    margin: 0 0 10px;
    color: #15161f;
    font-size: 40px;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -1.2px;
    font-family: 'Montserrat';
}

.ni-description {
    max-width: 100%;
    margin: 0;
    color: #666771;
    font-size: 15px;
    line-height: 1.7;
    font-weight: 400;
    font-family: 'Montserrat';
}


/* =====================================================
   FILTER BAR
===================================================== */

.ni-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    margin-top: 34px;
    margin-bottom: 32px;
}


/* LEFT FILTERS */

.ni-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.ni-filter {
    height: 42px;
    padding: 0 17px;
    border: 1px solid #e2e3e8;
    background: #ffffff;
    color: #50515b;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all .2s ease;
    font-family: 'Montserrat';
}

.ni-filter:hover {
    border-color: #ff0015;
    color: #ff0015;
}

.ni-filter.active {
    background: #ff0015;
    border-color: #ff0015;
    color: #ffffff;
}


/* RIGHT CONTROLS */

.ni-controls {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-shrink: 0;
}

.ni-search {
    position: relative;
}

.ni-search input {
    width: 196px;
    height: 39px;
    padding: 0px 7px 0 17px;
    border: 1px solid #e1e2e7;
    outline: none;
    background: #ffffff;
    color: #33343b;
    font-family: 'Montserrat';
    font-size: 13px;
}

.ni-search input::placeholder {
    color: #a0a1a8;
}

.ni-search input:focus {
    border-color: #c9cad0;
}

.ni-search-icon {
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 11px;
    color: #999aa2;
    display: none;
}


/* SORT */

.ni-sort {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #85868e;
    font-size: 12px;
    white-space: nowrap;
    font-family: 'Montserrat';
}

.ni-sort select {
    height: 34px;
    min-width: 80px;
    padding: 0 9px;
    border: 1px solid #e1e2e7;
    background: #fff;
    color: #33343b;
    outline: none;
    font-family: 'Montserrat';
    font-size: 12px;
    cursor: pointer;
    font-weight: 600;
}


/* =====================================================
   NEWS GRID
===================================================== */

.ni-grid {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 30px 18px;
}


/* =====================================================
   NEWS CARD
===================================================== */

.ni-card {
    min-width: 0;

    border: 1px solid #e2e3e8;

    background: #ffffff;

    overflow: hidden;

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.ni-card:hover {
    transform: translateY(-4px);

    box-shadow: 0 12px 30px rgba(20, 25, 40, .08);
}


/* IMAGE */

.ni-card-image {
    width: 100%;
    height: 230px;

    overflow: hidden;

    background: #eeeeee;
}

.ni-card-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .5s ease;
}

.ni-card:hover .ni-card-image img {
    transform: scale(1.04);
}


/* CARD CONTENT */

.ni-card-content {
    padding: 16px 18px 17px;
}


/* META */

.ni-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    margin-bottom: 14px;
}

.ni-category {
    color: #ff0015;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Montserrat';
}

.ni-date {
    color: #9697a0;
    font-size: 10px;
    font-weight: 500;
    white-space: nowrap;
    font-family: 'Montserrat';
}


/* TITLE */

.ni-card-title {
    display: -webkit-box;
    margin: 0 0 13px;
    color: #1b1c24;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 700;
    letter-spacing: -.2px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: 'Montserrat';
}


/* DESCRIPTION */

.ni-card-description {
    display: -webkit-box;
    margin: 0 0 13px;
    color: #696a73;
    font-size: 13px;
    line-height: 1.65;
    font-weight: 400;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: 'Montserrat';
}


/* CARD FOOTER */

.ni-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-top: 12px;

    border-top: 1px solid #e3e4e8;
}

.ni-read {
    color: #202128;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    font-family: 'Montserrat';
}

.ni-read:hover {
    color: #ff0015;
}

.ni-time {
    color: #999aa2;
    font-size: 11px;
    font-family: 'Montserrat';
}


/* =====================================================
   NO RESULTS
===================================================== */

.ni-no-results {
    display: none;

    grid-column: 1 / -1;

    padding: 50px 20px;

    text-align: center;

    color: #777;

    font-size: 13px;
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 900px) {

    .ni-container {
        width: calc(100% - 40px);
    }

    .ni-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .ni-controls {
        justify-content: space-between;
    }

    .ni-grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {

    .ni-section {
        padding: 30px 0 60px;
    }

    .ni-container {
        width: calc(100% - 30px);
    }

    .ni-heading {
        font-size: 30px;
    }

    .ni-description {
        font-size: 12px;
    }

    .ni-toolbar {
        margin-top: 25px;
    }

    .ni-filters {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
    }

    .ni-filter {
        width: 100%;
        padding: 0 8px;
    }

    .ni-controls {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .ni-search input {
        width: 100%;
    }

    .ni-sort {
        justify-content: space-between;
    }

    .ni-sort select {
        flex: 1;
    }

    .ni-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .ni-card-image {
        height: 220px;
    }

}

/* =========================================
   REGIONAL PRESENCE
========================================= */

.regional-presence {
  width: 100%;
  background: #ffffff;
  color: #0d0f13;
  padding: 52px 30px 58px;
}

.regional-container {
  max-width: 1220px;
  margin: 0 auto;
}


/* =========================================
   MAIN HEADING
========================================= */

.regional-heading {
  text-align: center;
}

.regional-eyebrow {
  color: #5d626d;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 28px;
  font-family: 'Montserrat';
}

.regional-heading h2 {
  margin: 0;
  font-size: 54px;
  line-height: 1.05;
  font-weight: 600;
  letter-spacing: -2px;
  font-family: 'Montserrat';
}

.regional-heading h2 span {
  color: #ed001d;
}

.regional-heading p {
  max-width: 1170px;
  margin: 16px auto 0;
  color: #6c7079;
  font-size: 15.5px;
  line-height: 1.55;
  font-weight: 400;
  font-family: 'Montserrat';
}


/* =========================================
   DIVIDER
========================================= */

.regional-divider {
  display: flex;
  align-items: center;
  gap: 28px;

  margin-top: 43px;
  margin-bottom: 44px;
}

.divider-title {
  display: flex;
  align-items: center;
  gap: 15px;
  color: #5c616b;
  font-size: 10.5px;
  font-weight: 800;
  white-space: nowrap;
  font-family: 'Montserrat';
}

.divider-title span {
  display: block;

  width: 38px;
  height: 2px;

  background: #ed001d;
}

.divider-line {
  flex: 1;

  height: 1px;
  background: #e5e5e5;
}


/* =========================================
   CONTENT GRID
========================================= */

.regional-content {
  display: grid;
  grid-template-columns: 1.05fr 1.15fr 1fr;
}

.regional-column {
  min-height: 153px;
}


/* =========================================
   COLUMN HEADINGS
========================================= */

.column-heading {
  display: flex;
  align-items: center;

  height: 27px;
  margin-bottom: 24px;
}

.column-heading strong {
  color: #ed001d;

  font-size: 12px;
  font-weight: 800;

  margin-right: 12px;
}

.column-heading > span {
  width: 38px;
  height: 2px;

  background: #ed001d;

  margin-right: 12px;
}

.column-heading h3 {
  margin: 0;
  color: #5c616b;
  font-size: 11px;
  font-weight: 700;
  font-family: 'Montserrat';
}


/* =========================================
   LOCATION LIST
========================================= */

.locations {
  padding-right: 35px;
}

.location-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);

  column-gap: 55px;
  row-gap: 14px;
}

.location-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.location-item i {
  color: #ed001d;

  font-size: 14px;
  font-style: normal;

  line-height: 1;
}

.location-item span {
  color: #626771;
  font-size: 14px;
  font-weight: 400;
  font-family: 'Montserrat';
}


/* =========================================
   OPERATIONAL STRENGTH
========================================= */

.strength {
  padding: 0 43px;

  border-left: 1px solid #e5e5e5;
  border-right: 1px solid #e5e5e5;
}

.stats-row {
  display: flex;
  align-items: center;

  margin-top: 3px;
}

.regional-stat {
  flex: 1;

  padding: 0 14px;

  border-right: 1px solid #e5e5e5;
}

.regional-stat:first-child {
  padding-left: 0;
}

.regional-stat:last-child {
  border-right: none;
}

.regional-stat strong {
  display: block;
  color: #0d0f13;
  font-size: 31px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -1.5px;
  display: flex;
  gap: 4px;
}

.regional-stat strong em {
  color: #ed001d;
  font-style: normal;
}

.regional-stat small {
  display: block;

  margin-top: 7px;

  color: #5e636d;

  font-size: 9px;
  font-weight: 800;
}


/* =========================================
   WHY IT MATTERS
========================================= */

.why {
  padding-left: 45px;
}

.why p {
  max-width: 320px;

  margin: 0;

  color: #6a6e77;

  font-size: 14px;
  line-height: 1.55;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1000px) {

  .regional-heading h2 {
    font-size: 46px;
  }

  .regional-heading p {
    font-size: 14px;
  }

  .regional-content {
    grid-template-columns: 1fr 1fr;
    gap: 35px;
  }

  .locations {
    padding-right: 20px;
  }

  .strength {
    padding: 0 20px;
  }

  .why {
    grid-column: 1 / -1;

    border-top: 1px solid #e5e5e5;

    padding: 30px 0 0;
  }

  .why p {
    max-width: 600px;
  }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 650px) {

  .regional-presence {
    padding: 45px 20px;
  }

  .regional-heading h2 {
    font-size: 38px;
    letter-spacing: -1px;
  }

  .regional-heading p {
    font-size: 13px;
    line-height: 1.6;
  }

  .regional-divider {
    margin-top: 35px;
    margin-bottom: 35px;
  }

  .divider-title {
    font-size: 9px;
  }

  .divider-title span {
    width: 28px;
  }

  .divider-line {
    display: none;
  }

  .regional-content {
    display: block;
  }

  .regional-column {
    padding: 0 !important;
    border: none !important;
    border-bottom: 1px solid #e5e5e5 !important;

    padding-bottom: 28px !important;
    margin-bottom: 28px;
  }

  .regional-column:last-child {
    border-bottom: none !important;
    margin-bottom: 0;
  }

  .location-list {
    column-gap: 25px;
    row-gap: 15px;
  }

  .location-item span {
    font-size: 13px;
  }

  .stats-row {
    justify-content: space-between;
  }

  .regional-stat {
    padding: 0 12px;
  }

  .regional-stat strong {
    font-size: 27px;
  }

  .regional-stat small {
    font-size: 8px;
  }

  .why p {
    font-size: 13px;
  }

}



/* =========================================
   GLOBAL CONNECTIONS SECTION
========================================= */

.global-connections {
  position: relative;
  width: 100%;
  height: 674px;
  background-image: url("https://rarholding.com/wp-content/uploads/2026/10/global-network-map.jpg");
  overflow: hidden;
  /* background: #f5f7f8; */
  background-size: cover;
}


/* =========================================
   CITYSCAPE
========================================= */

.city-bg {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 55%;
  /* background-image: url("global-cityscape-bg.jpg"); */
  /* background-size: cover; */
  /* background-position: center bottom; */
  /* background-repeat: no-repeat; */
  z-index: 1;
}


/* Fade city into white */

.city-bg::before {
  content: "";

  position: absolute;
  inset: 0;

  background: linear-gradient(
    to bottom,
    rgba(245, 247, 248, 1) 0%,
    rgba(245, 247, 248, .55) 22%,
    rgba(245, 247, 248, .05) 60%,
    rgba(245, 247, 248, 0) 100%
  );
}


/* =========================================
   WORLD MAP
========================================= */

.global-map {
  position: absolute;
  top: 25px;
  right: 55px;
  width: 53%;
  height: 330px;
  /* background-image: url("global-network-map.png"); */
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: .72;
  z-index: 2;
}


/* =========================================
   CONTENT
========================================= */

.connections-container {
  position: relative;

  width: 100%;
  max-width: 1280px;

  height: 100%;

  margin: 0 auto;

  z-index: 5;
}

.connections-content {
  position: absolute;

  top: 85px;
  left: 0;
}


/* =========================================
   HEADING
========================================= */

.connections-content h2 {
  margin: 0;
  color: #080a0d;
  font-family: 'Montserrat';
  font-size: 50px;
  line-height: 1.03;
  font-weight: 700;
  letter-spacing: -2px;
}

.connections-content h2 span {
  color: #080a0d;
}


/* =========================================
   RED LINE
========================================= */

.red-line {
  width: 65px;
  height: 4px;

  background: #ed001d;

  margin-top: 12px;
  margin-bottom: 15px;
}


/* =========================================
   STATS
========================================= */

.connection-stats {
  display: flex;

  gap: 16px;
}


.connection-card {
  position: relative;

  width: 140px;
  height: 140px;

  padding: 24px 15px;

  border: 1px solid rgba(205, 208, 211, .65);

  background: rgba(245, 247, 248, .32);

  backdrop-filter: blur(2px);
}


/* Number */

.connection-card strong {
  display: block;

  color: #0b0d10;

  font-size: 59px;
  line-height: .9;

  font-weight: 700;

  letter-spacing: -2px;
}


/* First and fourth numbers */

.connection-card:first-child strong,
.connection-card:last-child strong {
  color: #ed001d;
}


/* Label */

.connection-card span {
  position: absolute;
  left: 15px;
  bottom: 28px;
  color: #777b82;
  font-size: 12px;
  font-weight: 400;
  font-family: 'Montserrat';
}


/* Small red line */

.connection-card i {
  position: absolute;

  left: 15px;
  bottom: 18px;

  display: block;

  width: 36px;
  height: 3px;

  background: #ed001d;

  font-style: normal;
}


/* Small dots under line */

.connection-card::after {
  content: "••••••";

  position: absolute;

  left: 15px;
  bottom: 7px;

  color: #c7c9cc;

  font-size: 7px;

  letter-spacing: 2px;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1100px) {

  .connections-container {
    padding-left: 45px;
  }

  .connections-content {
    top: 80px;
  }

  .global-map {
    right: 10px;
    width: 55%;
  }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 700px) {

  .global-connections {
    height: auto;
    min-height: 650px;
  }

  .global-map {
    top: 30px;
    right: -80px;

    width: 100%;
    height: 260px;

    opacity: .45;
  }

  .city-bg {
    height: 45%;
  }

  .connections-container {
    padding: 0 20px;
  }

  .connections-content {
    position: relative;

    top: auto;
    left: auto;

    padding-top: 60px;
  }

  .connections-content h2 {
    font-size: 38px;
    letter-spacing: -1.5px;
  }

  .red-line {
    width: 55px;
    margin-top: 15px;
    margin-bottom: 20px;
  }

  .connection-stats {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 12px;
  }

  .connection-card {
    width: 100%;
    height: 125px;
  }

  .connection-card strong {
    font-size: 48px;
  }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 400px) {

  .connections-content h2 {
    font-size: 33px;
  }

  .connection-card {
    height: 115px;
    padding: 20px 13px;
  }

  .connection-card strong {
    font-size: 42px;
  }

  .connection-card span,
  .connection-card i {
    left: 13px;
  }

}

/* =========================
   CONTACT SECTION
========================= */

.contact-section {
  width: 100%;
  padding: 65px 0 75px;
  background: #fff;
  font-family: Arial, Helvetica, sans-serif;
}

.contact-container {
  width: 1170px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 382px;
  gap: 68px;
  align-items: start;
}


/* =========================
   HEADING
========================= */

.contact-heading {
  margin-bottom: 34px;
}

.contact-heading h2 {
  margin: 0 0 12px;
  color: #101628;
  font-size: 58px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -2px;
  font-family: 'Montserrat';
}

.contact-heading p {
  margin: 0;
  color: #858da0;
  font-size: 15px;
  line-height: 1.5;
  font-family: 'Montserrat';
}


/* =========================
   FORM BOX
========================= */

.contact-form-wrapper {
  /* border: 1px solid #e3e5e9; */
  /* padding: 42px 42px 45px; */
  box-sizing: border-box;
}

.contact-form {
  width: 100%;
  border: 1px solid #e3e5e9;
  padding: 40px;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px 17px;
}

.form-group {
  width: 100%;
}

.form-group label {
  display: block;
  margin-bottom: 8px;
  color: #687082;
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
  font-family: 'Montserrat';
}

.form-group input,
.form-group textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #dfe2e7;
  outline: none;
  background: #fff;
  color: #202536;
  font-family: 'Montserrat';
  font-size: 14px;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.form-group input {
  height: 56px;
  padding: 0 16px;
}

.form-group textarea {
  min-height: 170px;
  padding: 17px 16px;
  resize: vertical;
  line-height: 1.5;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
  color: #a2aaba;
  opacity: 1;
}

.form-group input:focus,
.form-group textarea:focus {
  border-color: #ff001b;
  box-shadow: 0 0 0 2px rgba(255, 0, 27, 0.07);
}

.message-group {
  margin-top: 29px;
}


/* =========================
   BOTTOM
========================= */

.form-bottom {
  margin-top: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

.form-bottom p {
  max-width: 330px;
  margin: 0;
  color: #737c8f;
  font-size: 13px;
  line-height: 1.5;
  font-family: 'Montserrat';
}

.form-bottom button {
  min-width: 176px;
  height: 49px;
  padding: 0 25px;
  border: 0;
  background: #ff001b;
  color: #fff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: background 0.25s ease, transform 0.2s ease;
  font-family: 'Montserrat';
}

.form-bottom button:hover {
  background: #d90017;
}

.form-bottom button:active {
  transform: scale(0.98);
}

.form-message {
  display: none;
  margin-top: 18px;
  padding: 12px 15px;
  background: #f0fff4;
  color: #198754;
  font-size: 14px;
}


/* =========================
   OFFICE CARD
========================= */

.office-card {
  position: relative;
  min-height: 580px;
  overflow: hidden;

  /*
    Apni office/background image yahan lagao
  */
  background-image: url("images/dubai-office.jpg");
  background-size: cover;
  background-position: center;
  color: #fff;
}

.office-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.7) 0%,
      rgba(0, 0, 0, 0.48) 38%,
      rgba(0, 0, 0, 0.88) 100%
    );
}

.office-content {
  position: relative;
  z-index: 2;
  height: 100%;
  min-height: 430px;
  padding: 20px 34px 1px;
  box-sizing: border-box;
}

.office-content h3 {
  margin: 0;
  color: #fff;
  font-size: 40px;
  line-height: 43px;
  font-weight: 700;
  letter-spacing: -1px;
  font-family: 'Montserrat';
}

.office-content h3 span {
  color: #ff001b;
}

.location-title {
  margin: 20px 0 0;
  color: #bfc0c4;
  font-size: 15px;
  line-height: 1.4;
  font-family: 'Montserrat';
}

.office-divider {
  width: 100%;
  height: 1px;
  margin: 30px 0 10px;
  background: rgba(255, 255, 255, 0.16);
}

.office-info {
  display: flex;
  flex-direction: column;
  gap: 23px;
}

.info-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.info-icon {
  flex: 0 0 22px;
  width: 22px;
  color: #ff001b;
  font-size: 23px;
  line-height: 1;
  text-align: center;
}

.info-item a,
.info-item p {
  margin: 0;
  color: #eee;
  font-size: 15px;
  line-height: 1.5;
  text-decoration: none;
  font-family: 'Montserrat';
}

.info-item a:hover {
  color: #ff001b;
}


/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1100px) {

  .contact-container {
    width: min(94%, 900px);
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .office-card {
    min-height: 500px;
  }

  .office-content {
    min-height: 500px;
  }
}


@media (max-width: 700px) {

  .contact-section {
    padding: 45px 0;
  }

  .contact-container {
    width: calc(100% - 30px);
    gap: 30px;
  }

  .contact-heading h2 {
    font-size: 42px;
    letter-spacing: -1px;
  }

  .contact-heading p {
    font-size: 14px;
  }

  .contact-form-wrapper {
    padding: 28px 20px 30px;
  }

  .form-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .message-group {
    margin-top: 22px;
  }

  .form-bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .form-bottom p {
    max-width: 100%;
  }

  .form-bottom button {
    width: 100%;
  }

  .office-card {
    min-height: 540px;
  }

  .office-content {
    min-height: 540px;
    padding: 40px 25px 30px;
  }

  .office-content h3 {
    font-size: 35px;
  }

  .location-title {
    font-size: 17px;
    margin-top: 24px;
  }

  .info-item a,
  .info-item p {
    font-size: 15px;
  }
}



/* =========================
   MAIN SECTION
========================= */

.office-directory {
  width: 100%;
  min-height: 100vh;
  background:
    radial-gradient(
      circle at 85% 20%,
      rgba(100, 0, 20, 0.16),
      transparent 35%
    ),
    #05070a;
  color: #fff;
  padding: 60px;
  position: relative;
}

.directory-container {
  width: 100%;
  max-width: 1170px;
  margin: auto;
}


/* =========================
   HEADER
========================= */

.directory-header {
  margin-bottom: 30px;
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 13px;
  color: #8c8e93;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .5px;
  margin-bottom: 15px;
  position: relative;
}

.eyebrow span {
  width: 24px;
  height: 2px;
  background: #ed001d;
  display: block;
}

.directory-header h1 {
  font-size: 56px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -2px;
  font-family: 'Montserrat';
}

.directory-header h1 strong {
  color: #ed001d;
  font-weight: 600;
}

.directory-header p {
  margin-top: 15px;
  color: #a4a5a9;
  font-size: 16px;
  font-family: 'Montserrat';
}


/* =========================
   CARDS GRID
========================= */

.office-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}


/* =========================
   OFFICE CARD
========================= */

.office-card {
  min-height: 199px;
  border: 1px solid #202328;
  background: rgba(7, 9, 12, 0.75);
  padding: 27px 25px;
  transition: .3s ease;
  /* background-image: url(img/Background.png); */
  background-size: contain;
}

.office-card:hover {
  border-color: #3b3d42;
  transform: translateY(-3px);
}


/* Top */
.location-item img {
    height: 14px;
}
.office-top {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 60px;
}
.office-icon img {
    width: 40px !important;
    height: 40px !important;
    object-fit: contain;
}
.office-info img {
    width: 14px !important;
    transform: translateY(3px);
    height: 14px;
    object-fit: contain;
    object-position: center;
}
.office-icon {
  width: 45px;
  min-width: 45px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ed001d;
  font-size: 30px;
  /* filter: grayscale(1); */
}

.office-top h3 {
  font-size: 14px;
  line-height: 1.15;
  font-weight: 700;
  color: #f1f1f1;
  font-family: 'Montserrat';
}

.office-top span {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  font-weight: 500;
  color: #929398;
  letter-spacing: .15px;
  font-family: 'Montserrat';
}


/* Divider */

.office-info {
  border-top: 1px solid #202328;
  margin-top: 13px;
  padding-top: 17px;
}


/* Info rows */

.office-info > div {
  display: flex;
  align-items: flex-start;
  gap: 13px;

  margin-bottom: 11px;
}

.office-info > div:last-child {
  margin-bottom: 0;
}

.office-info i {
  width: 14px;
  min-width: 14px;
  font-size: 13px;
  font-style: normal;
  color: #92959a;
}

.office-info p {
  color: #ffffff;
  font-size: 13px;
  line-height: 1.45;
  font-family: 'Montserrat';
  margin: 0;
}


/* =========================
   FOOTER
========================= */

.directory-footer {
  display: grid;
  grid-template-columns: 1.2fr 2fr 1.2fr;
  align-items: center;

  border-top: 1px solid #1c1f23;

  margin-top: 30px;
  padding-top: 30px;
}


/* Footer label */

.footer-label span {
  width: 25px;
  height: 2px;

  display: block;
  background: #ed001d;

  margin-bottom: 9px;
}

.footer-label p {
  color: #8e9094;
  font-size: 10px;
  font-weight: 700;
  font-family: 'Montserrat';
}


/* Stats */

.stats {
  display: flex;
  justify-content: center;
}

.stat {
  display: flex;
  align-items: center;
  gap: 17px;

  padding: 0 38px;

  border-right: 1px solid #1c1f23;
}

.stat:last-child {
  border-right: none;
}

.stat strong {
  color: #fff;

  font-size: 32px;
  line-height: 1;

  font-weight: 800;
}

.stat span {
  color: #929398;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  font-family: 'Montserrat';
}


/* Right */

.footer-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.footer-right span {
  color: #8e9094;

  font-size: 10px;
  font-weight: 700;
}

.footer-right i {
  width: 40px;
  height: 2px;

  background: #ed001d;

  display: block;
  margin-top: 9px;
}

section.office-directory {}

section.office-directory .stats {
    position: relative;
    top: 0;
    border: none;
    background: transparent;
}

section.office-directory .stats .stat {
    flex-direction: row;
    min-height: 30px;
}
/* =========================
   TABLET
========================= */

@media (max-width: 1100px) {

  .office-directory {
    padding: 45px 30px;
  }

  .office-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .directory-footer {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .footer-label {
    text-align: center;
  }

  .footer-label span {
    margin-left: auto;
    margin-right: auto;
  }

  .footer-right {
    align-items: center;
  }

}


/* =========================
   MOBILE
========================= */

@media (max-width: 600px) {

  .office-directory {
    padding: 40px 18px;
  }

  .directory-header h1 {
    font-size: 42px;
  }

  .directory-header p {
    font-size: 14px;
    line-height: 1.5;
  }

  .office-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .office-card {
    min-height: auto;
    padding: 23px 20px;
  }

  .directory-footer {
    margin-top: 25px;
    padding-top: 25px;
  }

  .stats {
    flex-direction: column;
    gap: 20px;
  }

  .stat {
    justify-content: center;
    border-right: none;
    border-bottom: 1px solid #1c1f23;
    padding: 0 0 18px;
  }

  .stat:last-child {
    border-bottom: none;
  }

  .footer-right span {
    text-align: center;
  }

}


.office-card2 {
    min-height: 199px;
    border: 1px solid #202328;
    background: rgba(7, 9, 12, 0.75);
    padding: 27px 25px;
    transition: .3s ease;
    background-image: url(https://rarholding.com/wp-content/uploads/2026/10/global-network-map.jpg);
    /* background-size: contain; */
    position: relative;
}

.office-info {}

.office-card2 .office-info {
    border: none !important;
}


.info-icon svg {
    width: 100%;
}