/* You can add global styles to this file, and also import other style files */
@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
    font-family: 'RupeeForadian';
    src: url('../fonts/RupeeForadian.eot');
    src: url('../fonts/RupeeForadian.eot') format('embedded-opentype'),
         url('../fonts/RupeeForadian.woff2') format('woff2'),
         url('../fonts/RupeeForadian.woff') format('woff'),
         url('../fonts/RupeeForadian.ttf') format('truetype'),
         url('../fonts/RupeeForadian.svg#Rupee_Foradian') format('svg');
}
 

:root {
    --font-Aller: 'aller',sans-serif,Arial,Helvetica;
    --font-Aaux-next: 'aaux-next',sans-serif,Arial,Helvetica; 
    --font-Acumin-Pro: 'acumin-pro',sans-serif,Arial,Helvetica; 
    --font-Merriweather-Sans: 'Merriweather Sans',sans-serif,Arial,Helvetica; 
    --font-Roboto: 'Roboto',sans-serif,Arial,Helvetica; 
    --font-Rupee: 'RupeeForadian',sans-serif,Arial,Helvetica; 
    --color-white: #ffffff;
    --color-black: #000000; 
    --color-red: #c9252b; 
    --color-gray: #5d5e66; 
    --color-yellow: #FEC22A; 
}
 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{	margin: 0; padding: 0; border: 0;}
html {-webkit-font-smoothing: antialiased; width: 100%; font-size: 22px; }
body { position: relative; width: 100%;  /* overflow-x: hidden !important; */ }
html, body{ font-family: var(--font-Aller); font-weight: 500; margin:0; padding:0; overflow-x: hidden!important; }
html.lenis,html.lenis body { height: auto;}
.lenis.lenis-smooth { scroll-behavior: auto !important;}
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain;}
.lenis.lenis-stopped { overflow: clip;}
.lenis.lenis-smooth iframe { pointer-events: none;}
figure{ margin: 0;}
img{max-width:100%;height:auto; }
p{ font-size: 1rem; line-height: 1.2;margin: 0; padding: 10px 0;}
a{text-decoration:none;cursor:pointer;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}
a:hover,a:focus,.btn:hover,.btn:focus,button:focus{text-decoration:none;outline:none; box-shadow:none}
button:hover,button:focus,.accordion-button:focus{outline:none;box-shadow:none}
ul,li,ol{padding:0;margin:0}
img{ width: 100%; height: auto;}
ul li{list-style:none;}
/* .rupee{ font-family: $font_Rupee;} */
.no-scroll { height: 100%; overflow: scroll; overflow: hidden; position: fixed;}

/* input:read-only {
    background-color: #ececeb;
  } */

/*==============ANIMATIONS=================*/

*{ -webkit-tap-highlight-color: transparent; outline: none; text-decoration:none; outline:none; outline-color:none; }

/*==============PAGES CSS=================*/

/* Header */
#wrapper{ position: relative; width: 100%;}
.inner-pages{ padding-top: 80px;}
.container{ position: relative;  width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 20px;}
.section{ position: relative; width: 100%; padding: 80px 0;}
.bg-cover{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover;}
.rs{ font-family: var(--font-Rupee);}
h1{ font-family: var(--font-Aller); font-size: 44px; color: var(--color-black);}
h4{ font-family: var(--font-Aaux-next); font-size: 22px; color: var(--color-red); font-weight: 700; padding-bottom: 20px;}
h5{ font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-black); line-height: 1.2; font-weight: 600; padding: 20px 0 10px;}
p{ font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-gray); line-height: 1.3; font-weight: 400; padding: 0 0 15px;}
p a{ color: var(--color-gray);}
.sect-tl h3{ font-family: var(--font-Acumin-Pro); font-size: 20px; color: var(--color-black); font-weight: 700; text-transform: uppercase; padding-bottom: 10px;}
.sect-tl h2{ font-size: 50px; color: var(--color-red);} 
.bg-gray{ background: #f2f2f3;}
.page-intro{ font-family: var(--font-Aaux-next); font-size: 22px; color: var(--color-black); font-weight: 700; line-height: 1.4; padding: 30px 0 ;}
.custom-delay-1 { animation-delay: 0s; }
.custom-delay-2 { animation-delay: 0.2s; }
.custom-delay-3 { animation-delay: 0.4s; }
.custom-delay-4 { animation-delay: 0.6s; }
.custom-delay-5 { animation-delay: 0.8s; }
.custom-delay-6 { animation-delay: 1s; }
.custom-delay-7 { animation-delay: 1.2s; }
.custom-delay-8 { animation-delay: 1.4s; }
.custom-delay-9 { animation-delay: 1.6s; }
.custom-delay-10 { animation-delay: 1.8s; } 

.com-list li{ position: relative; font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-gray); font-weight: 400; line-height: 1.3; padding: 5px 0 5px 25px; }
.com-list li::before{ content: '»'; position: absolute; left: 0; top: -1px; font-size: 22px; color: var(--color-gray);}

.header-hld{ position: fixed; left: 0; top: 0; width: 100%; width: 100%; z-index: 99;}
header{ width: 100%; width: 100%; padding: 10px 0; background: var(--color-white);}
header .logo{ width: 100%; max-width: 220px; /* border: var(--color-white) 1px solid; */}
header nav{ display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100vh; }
header nav .bg-overlay{ position: absolute; left: 0; top: 0; display: flex; flex-direction: row; width: 100%; height: 100%; pointer-events: none; }
header nav .bg-overlay span{ display: block; width: 12.5%; height: 0; background: #fff8e9;/*  border: #000000 1px solid;  */}
header .nav-hld{ padding: 100px 0 0 0; opacity: 0;}
header .nav-hld h4{ font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-red); font-weight: 700; padding-bottom: 20px;}
header .nav-hld ul{ padding: 0px 0 50px; }
header .nav-hld li{ line-height: 100%; padding: 5px 0 0;  }
header .nav-hld li a{ display: inline-block; font-family: var(--font-Acumin-Pro); font-size: 16px; color: var(--color-black); line-height: 100%; font-weight: 400; letter-spacing: 1px; padding-bottom: 8px; border-bottom: transparent 1px solid;}
header .nav-hld li a:hover{ color: var(--color-red); border-bottom: var(--color-red) 1px solid;}
header .nav-hld figure{ width: 100%; max-width: 220px;}

.nav-icon { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); width: 45px; height:45px; margin: 0px auto; padding: 5px; z-index: 99; cursor: pointer; }
.nav-icon span{ display: block; position: relative; width: 100%; height: 3px;  opacity: 1; left: 0px; transform: rotate(0deg); transition: .25s ease-in-out; background: var(--color-red); border-radius: 100px;}
.nav-icon span:nth-child(1) { top: 5px;}
.nav-icon span:nth-child(2) { top: 12px;}
.nav-icon span:nth-child(3) { top: 19px;}
.nav-icon.open span{ background: var(--color-red);}
.nav-icon.open span:nth-child(1) { top: 15px; transform: rotate(135deg);}
.nav-icon.open span:nth-child(2) { opacity: 0; left: 30px;}
.nav-icon.open span:nth-child(3) { top: 9px; transform: rotate(-135deg);} 

/* Footer */ 
footer{ font-family: var(--font-Acumin-Pro); font-size: 14px; color: var(--color-white); line-height: 100%; font-weight: 400; /* text-align: center; */ padding: 20px 0; background: #4c4c4c;}

.inner-banner.inner-banner-hld{ padding: 0;}
.inner-banner.inner-banner-hld figure{ position: relative; padding-bottom: 30%;}
.inner-banner.inner-banner-hld .container{ position: absolute; left: 50%; bottom: 10%; transform: translateX(-50%);}
.inner-banner.inner-banner-hld .sect-tl h3, .inner-banner.inner-banner-hld .sect-tl h2{ color: var(--color-white);}

/* Graph */
.graph-blurb{ margin-bottom: 30px;}
.graph-con{ display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding: 20px; background: #f1f1f2; border-radius: 10px; }
.graph-con h5{ font-family: var(--font-Acumin-Pro); font-size: 18px; color: var(--color-red); line-height: 1.1; font-weight: 700; letter-spacing: 0.5px; }
.graph-con .unit{ font-family: var(--font-Acumin-Pro); font-size: 14px; color: #4c4d4f; font-weight: 400;  }
.graph-con ul{ position: relative; display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; padding: 50px 30px 0; margin-bottom: 40px; }
.graph-con ul::after{ content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 100%; height: 1px; background: var(--color-black);}
.graph-con ul li{ position: relative; width: calc(20% - 20px); height: 240px; }
.graph-con ul li .progress-con{ position: absolute; left: 0; bottom: 0; width: 100%; height: 100%;}
.graph-con ul li .progress-con:hover .fig{ top: -30px; transition: all .2s ease-out;}
.graph-con ul li .fig, .graph-con ul li .year{ position: absolute; left: 50%; transform: translateX(-50%); font-family: var(--font-Acumin-Pro); font-size: 14px; color: #4c4d4f; font-weight: 600; transition: all .2s ease-out;}
.graph-con ul li .fig{ top: -25px;}
.graph-con ul li .year{ bottom: -25px;}
.graph-con ul li:nth-child(1) .progress-con{ background: #c7c8ca; }
.graph-con ul li:nth-child(2) .progress-con{ background: #ffd886; }
.graph-con ul li:nth-child(3) .progress-con{ background: #fec22a; }
.graph-con ul li:nth-child(4) .progress-con{ background: #dc7e6f; }
.graph-con ul li:nth-child(5) .progress-con{ background: #cd383f;}
.graph-con ul li:nth-child(5) .progress-con .fig{ color: var(--color-red);} 
.graph-hld{ padding-bottom: 50px;}
.graph-hld .note-hld p{ font-size: 12px; color: #4c4d4f; font-weight: 400; line-height: 1.3; padding: 0;}

.counter-panel{ width: 100%; }
.counter-hld{ padding: 30px 0 0 0;}
.counter-con{ position: relative; padding: 25px 0; border-bottom: var(--color-red) 1px solid;}
.counter-con .count{ font-family: var(--font-Aaux-next); font-size: 50px; color: var(--color-red); font-weight: 600; line-height: 100%;}
.counter-con .unit{ font-size: 30px;}
.counter-con p{ padding: 10px 0 0;}
.counter-con .rs{ font-weight: 500;}

.at-a-glance{ background: #fff8e9;}

.bod-hld{ padding: 0 0 0px 0;}
.bod-hld .bod-blurb{ padding-bottom: 30px; }
.bod-hld .bod-info{ padding: 20px 0px; }
.bod-hld .bod-info h4{ padding: 0 0 5px; }
.bod-hld .designation{ font-size: 16px; color: var(--color-gray); font-weight: 600;}
.bod-hld .bod-info p{ font-size: 16px; padding: 10px 0 10px;}
.bod-hld .bod-info p span{ display: block;}
.bod-hld .read-more{ display: inline-block; font-family: var(--font-Aaux-next); font-size: 14px; color: var(--color-black); text-transform: uppercase; font-weight: 600; transition: all .2s ease-out; }
.bod-hld .read-more i{ padding-left: 5px; transition: all .2s ease-out; }
.bod-hld .read-more:hover{ color: var(--color-red);} 
.bod-hld .read-more:hover i{ padding-left: 10px; transition: all .2s ease-out;}

.modal{ position: fixed; left: 0; top: 0; text-align: center; background: #0000008f; z-index: 99999;}
.modal:before { content: " "; display: inline-block; vertical-align: middle; height: 100%;}
.modal-dialog { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)!important; width: 100%; max-width: 1000px; margin: 0; padding: 0 20px; text-align: left; vertical-align: middle;}
.modal-dialog .btn-close{ position: absolute; right: 40px; top: 30px; font-size: 24px; color: var(--color-red); background: none; outline: none!important; border: none!important; box-shadow: none!important; opacity: 1;}
.modal-dialog .btn-close i{ transition:all .3s ease-out;}
.modal-dialog .btn-close:hover i{ rotate: 90deg; transition:all .3s ease-out;}
.modal-content{ padding: 70px 30px 30px; border-radius: 20px;}

.lt-team{ padding-top: 10px;}
.lt-team p{ font-size: 14px;}
.lt-team .lt-info-2{ text-align: right;}
.lt-comlete-bannet{ padding-top: 30px;}

.reveal-banner{ position: relative; width: 100%; overflow: hidden;}
.reveal-banner figure{ overflow: hidden;} 
.reveal-banner .reveal-overlay{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background:var(--color-white); }

.strategic-diretion{ text-align: center;}

.board-header{ font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-white); line-height: 1.2; font-weight: 600; padding: 15px 20px; background: var(--color-red);}
.board-list{ position: relative; display: flex; align-items: center; padding-left: 40px;}
.board-list::before{ content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 98%; background: var(--color-gray);}
.board-list li{ position: relative; font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-gray); font-weight: 400; line-height: 1.3; padding: 10px 0 10px 25px; }
.board-list li::before{ content: '»'; position: absolute; left: 0; top: 7px; font-size: 22px; color: var(--color-gray);}

.gem-initiative{ padding: 20px; background: var(--color-red);}
.gem-initiative h4, .gem-initiative p{ color: var(--color-white);}
.accountability{ width: 100%; padding: 20px;}

.risk-hld{ padding: 30px 0 30px;}
.risk-hld figure{ width: 100%; max-width: 80px;}
.risk-hld p{ padding: 15px 0 0;}

.risk-framework{ margin: 30px 0 50px;}

.strength-controls{ padding: 30px 0 10px; border-bottom: var(--color-black) 1px solid;}

.block-hld{ padding: 15px 0;}
.block-hld .block-blurb{ padding: 20px; margin: 10px 0; background: #ffebb2;}
.block-hld .block-blurb p{ padding: 0;}

.number-bullet-hld{ position: relative; text-align: center; padding: 30px 0 50px;}
.number-bullet-hld::before{ content: ''; position: absolute; left: 50%; top:55px; transform: translateX(-50%); width: 75%; height: 1px; background: var(--color-gray);}
.number-bullet-hld .number-bullet{ position: relative;}
.number-bullet-hld .number{ display: flex; flex-direction: row; align-items: center; justify-content: center; width: 50px; height: 50px; font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-white); font-weight: 600; margin: 0 auto; background: var(--color-red); border-radius: 100px;}
.number-bullet-hld p{ padding: 15px 0 0;}

.case-study{ position: relative; padding: 50px 20px 30px; margin-top: 20px; border: var(--color-red) 1px solid;}
.case-study .title{ position: absolute; left: 20px; top: -20px; font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-white); line-height: 100%; letter-spacing: 2px; font-weight: 400; padding: 10px 15px; background: var(--color-red);}
.case-study .cs-heading{ display: flex; flex-direction: row; align-items: center; padding: 0 0 20px;}
.case-study .cs-heading h5{ font-size: 22px; padding: 0 0 0 20px;}
.case-study .cs-heading img{ width: 60px; }

.awards-hld{ width: 100%; max-width: 900px; margin: 0 auto; border: 10px var(--color-red) solid;}

.oc-hld{ background: #f2f2f3;}
.oc-panel .title{ display: flex; flex-direction: row; align-items: center; position: relative; font-family: var(--font-Aaux-next); font-size: 40px; color: var(--color-red); line-height: 1.1; font-weight: 600; padding: 20px 0 0;}
.oc-panel .title::before{ content: ''; position: absolute; left: 0; top: 0; width: 90px; height: 6px; background-color: #fec22a; border-radius: 50px;}
.oc-panel .title span{ padding-right: 10%;}
.oc-panel .title img{ width: 90px;}
.oc-panel .oc-details{ display: flex; flex-direction: column; justify-content: center; padding: 30px; margin-left: -10%; background: var(--color-white); z-index: 9;}
.oc-panel figure{ position: relative; padding-bottom: 68.57%;}
.oc-panel li{ position: relative; font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-gray); font-weight: 400; line-height: 1.2; padding: 5px 0 5px 25px; }
.oc-panel li::before{ content: '»'; position: absolute; left: 0; top: 0px; font-size: 22px; color: var(--color-gray);}
.oc-panel .num-indicated{ width: 100%; max-width: 200px; font-family: var(--font-Aaux-next); font-size: 12px; color: var(--color-gray); font-weight: 400; padding: 10px 0 0; margin-top: 20px; border-top: var(--color-red) 1px solid;}
.oc-panel .num-indicated span{ display: block;}

.outstanding-graph{ padding: 50px 30px 30px; background: var(--color-white);}
.outstanding-graph figure{ position: relative; padding-bottom: 45.94%;}

.tech-gov{ padding: 30px 0 0;}
.tech-gov .oc-panel{ padding: 30px; background: var(--color-white);}
.tech-gov .oc-panel p{ padding-bottom: 0;}

.leadership-msg{ padding: 30px; background: var(--color-white);}

.our-journey{ padding-top: 50px;}
.our-journey-hld{ background: var(--color-white);}
.our-journey-hld .year{ font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-white); line-height: 100%; font-weight: 400; /* text-transform: uppercase; */ padding: 10px 20px; background: var(--color-red);}
.our-journey-hld .journey-desc{ position: relative; padding: 20px; background: var(--color-white);}
.our-journey-hld .journey-desc h5{color: #2a6c97; padding: 10px 0;}

.journey-core-values{ position: relative; margin-top: 10px; padding: 20px; background: var(--color-white);}
.journey-core-values .value-tl{ position: absolute; left: 50%; top: -30px; transform: translateX(-50%); display: inline-block; font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-white); font-weight: 400; margin: 0 auto; padding: 10px 20px; background: var(--color-red); }
.journey-core-values .core-value-hld{ padding-top: 30px; text-align: center;}
.journey-core-values .core-value-hld .icon{ width: 100%; max-width: 90px; margin: 0 auto 15px;}

.esg-pillars .piller-list{ display: flex; flex-direction: row; align-items: center; padding: 20px 0 20px 20px; }
.esg-pillars .icon{ display: block; width: 100%; max-width: 80px; margin-right: 20px;}
.esg-pillars h5{ padding: 0 0 10px;}

.esg-value-det{ padding: 20px 0 0 0;}
.esg-value-det .year{ text-align: center; text-transform: none;}
.sustainable-value .journey-desc{ background: #fff4db;}
.value-reation-con{ display: flex; flex-direction: row; padding: 20px 0; }
.value-reation-con .value-type{ display: flex; flex-direction: row; align-items: center; justify-content: center; width: 40px; height: 40px; font-family: var(--font-Aaux-next); font-size: 20px; color: var(--color-white); line-height: 100%; font-weight: 400; background: #ffc22c; border-radius: 50px;}
.value-reation-con .value-desc{ width: calc(100% - 40px); padding-left: 20px;}
.value-reation-con .value-desc h4{ padding-bottom: 10px;}
.down-arrow{ position: absolute; left: 50%; bottom: -20px; transform: translateX(-50%); display: flex; flex-direction: row; align-items: center; justify-content: center; width: 40px; height: 40px; font-size: 16px; color: var(--color-white); background: #ffc22c; border-radius: 100px;}
.down-arrow svg{ fill: var(--color-white);}

.esg-priorities-chart{ position: relative; display: flex; flex-direction: row; text-align: center; margin-top: 30px;}
.esg-priorities-chart::before{ content: ''; position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 80%; height: 1px; background: var(--color-red);}
.chart-blurb{ position: relative; width: 20%; font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-black); font-weight: 600; line-height: 1.2; padding: 70px 15px 0;}
.chart-blurb::before{ content: ''; position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 1px; height: 60px; background: var(--color-red); }
.chart-blurb::after{ content: ''; position: absolute; left: 50%; top: 60px; transform: translateX(-50%); width: 5px; height: 5px; background: var(--color-red); border-radius: 50px; }

.esg-priorities .icon{ max-width: 50px!important; margin: 0 20px 0 0!important;}
.esg-priorities p{ padding: 0;}
.esg-priorities h5{ display: inline-block; position: relative; padding-right: 50px!important;}
.esg-priorities h5::before{ content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 40px; height: 1px; background: var(--color-red);}
.esg-priorities h5::after{ content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; background: var(--color-red); border-radius: 50px; }
.esg-priorities .journey-core-values{ padding-bottom: 50px;}

.value-for-stakeholders{ margin-top: 10px;}
.value-for-stakeholders .journey-desc{ background: #fff4db;}
.value-for-stakeholders li{ position: relative; font-family: var(--font-Aaux-next); font-size: 16px; color: var(--color-gray); font-weight: 400; line-height: 1.2; padding: 5px 0 5px 25px; }
.value-for-stakeholders li::before{ content: '»'; position: absolute; left: 0; top: -1px; font-size: 22px; color: var(--color-gray);}
.value-for-stakeholders .pointer-notes{ background: var(--color-white)!important;}
.value-for-stakeholders .value-reation-con{ align-items: center;}
.value-for-stakeholders .pointer-notes p{ padding: 0!important;}

.esg-graph-hld .graph-con ul li{ width: calc(25% - 20px);}
.esg-performance{ padding: 20px; background: var(--color-red);}
.esg-performance h4, .esg-performance p{ color: var(--color-white);}
.esg-performance img{ width: 100%; max-width: 150px;}

.esg-graph-hld .graph-con ul li:nth-child(1) .progress-con{ background: #ffd886; }
.esg-graph-hld .graph-con ul li:nth-child(2) .progress-con{ background: #fec22a; }
.esg-graph-hld .graph-con ul li:nth-child(3) .progress-con{ background: #dc7e6f; }
.esg-graph-hld .graph-con ul li:nth-child(4) .progress-con{ background: #cd383f;}

.people-says{ width: 100%; height: 100%; padding: 30px; background: var(--color-red);}
.people-says .message{ position: relative; width: 100%; border-top: var(--color-white) 1px solid;}
.people-says .message::before, .people-says .message::after{ content: ''; position: absolute; top: -8px; width: 15px; height: 15px; background: var(--color-white); border-radius: 20px;}
.people-says .message::before{ left: 0;}
.people-says .message::after{ left: 17px;}
.people-says .message h5, .people-says .message p{ color: var(--color-white); font-weight: 600; padding-top: 20px;}

.living-values{ margin-top: 20px; padding: 20px 0 0; }
.red-highlight{ padding: 20px; background: var(--color-red);}
.red-highlight h4, .red-highlight h5, .red-highlight p{ color: var(--color-white);}

.mera-sujhaav{ width: 100%; max-width:200px;}

.strategy-hld .graph-con ul{ width: 70%; margin:0; margin-bottom: 40px;}
.strategy-hld .graph-con ul li{ width: calc(50% - 20px);}
.strategy-hld .graph-con ul li:nth-child(1) .progress-con{ background: #fec22a; } 
.strategy-hld .graph-con ul li:nth-child(2) .progress-con{ background: #cd383f;}

.strategy-hld .tag-line{ position: relative; font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-white); line-height: 1.1; font-weight: 600; padding: 15px 20px 15px 130px; background: var(--color-red);}
.strategy-hld .tag-line .icon{ position: absolute; left: 20px; top: 50%; transform: translateY(-50%); width: 90px; border-radius: 100px; overflow: hidden;}

.strategy-hld .profit h4{ padding: 0 10px;}
.strategy-hld .profit{ display: flex; flex-direction: row; align-items: center; }
.strategy-hld .profit .indicator{ display: block; width: 22px;}
.strategy-hld .profit .indicator.down img{ rotate: 180deg;}

/* Home page */
.home-page p { font-family: var(--font-Roboto); font-size: 20px; color: var(--color-black); font-weight: 400; line-height: 1.3;}
.home-page .container{ width: 100%; max-width: 1500px; padding: 0 20px;}
.home-header header{ background: none; transition: all .2s ease-out;}
.home-header header.sticky{ background: var(--color-white); transition: all .2s ease-out;}
.hm-read-more{ display: flex; flex-direction: row; align-items: center; font-family: var(--font-Aaux-next); font-size: 18px; color: var(--color-black); font-weight: 600; }
.hm-read-more span{ display: flex; flex-direction: row; align-items: center; justify-content: center; width: 30px; height: 30px; background: var(--color-yellow); padding: 5px; margin-left: 5px; border-radius: 50px; overflow: hidden; transition: all .2s ease-out;}
.hm-read-more:hover{ color: var(--color-red);}
.hm-read-more:hover span{ margin-left: 10px; transition: all .2s ease-out;}
.btn-redirect{ display: flex; width: 100%;}

.hm-sect-tl{ text-align: center;}
.hm-sect-tl h2{ font-family: var(--font-Merriweather-Sans); font-size: 48px; color: var(--color-red); line-height: 1.2; font-weight: 600; }
.hm-sect-tl h3{ font-family: var(--font-Roboto); font-size: 20px; color: var(--color-black); font-weight: 400; text-transform: uppercase; padding-bottom: 15px;}

.home-page .swiper-pagination-bullet{ width: 30px; height: 5px; background: #D9D9D9; border-radius: 10px; opacity: 1; transition: all .2s ease-out; margin: 0 5px!important;}
.home-page .swiper-pagination-bullet-active{ width: 60px; background: var(--color-yellow); transition: all .2s ease-out;}

#banner{ position: relative; width: 100%; height: 100vh; background: var(--color-black); overflow: hidden;/*  border: var(--color-red) 1px solid; */}
#banner figure{ display: none; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; overflow: hidden;}
#banner video{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 105%; height: auto; }
#banner .banner-video-mob{ display: none;}
#banner .container{ position: absolute; left: 50%; top: 0; transform: translateX(-50%); height: 100%; }
#banner .banner-det{ position: absolute; left: 20px; top: 50%; transform: translateY(-50%);}
#banner h1{ font-family: var(--font-Merriweather-Sans); font-size: 82px; color: var(--color-white); line-height: 1.2; font-weight: 600; padding: 0 0 50px; opacity: 0; }
#banner .report-link-hld{ opacity: 0; }
#banner .report-link{ display: inline-block; font-family: var(--font-Merriweather-Sans); font-size: 22px; color: var(--color-white); line-height: 1.5; }
#banner .report-link .arrow{ display: flex; flex-direction: row; align-items: center; justify-content: center; width: 26px; height: 26px; margin-top: 10px; background: var(--color-yellow); border-radius: 100px; overflow: hidden; } 
#banner .report-link .arrow svg{ width: 22px; fill: var(--color-red);}
#banner .report-link:hover .arrow{ background: var(--color-red); transition: all .2s ease-out;}
#banner .report-link:hover line, #banner .report-link:hover polyline{ stroke: var(--color-white); transition: all .2s ease-out;}

.performance-meet{ width: 100%; position: relative; padding: 200px 0; overflow: hidden;}
.performance-meet figure{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 100%;}
.performance-meet .intro .hm-read-more{ justify-content: center; color: var(--color-white); margin-top: 20px;}
.performance-meet .intro p{ color: var(--color-white); text-align: center; padding: 15px 0;}
.performance-meet .intro .hm-sect-tl{ padding-bottom: 30px;}
.performance-meet .intro .hm-sect-tl h2{ color: var(--color-yellow);}

.performance-meet .meet-purpose{ padding-top: 100px; margin-top: 80px;}
.performance-meet .meet-purpose .hm-sect-tl{ text-align: center;}
.performance-meet .meet-purpose .hm-sect-tl h2{ color: var(--color-white);}
.performance-meet .profit{ display: flex; flex-direction: row; align-items: center; }
.performance-meet .profit p{ font-weight: 400;}
.performance-meet .profit .indicator{ display: block; width: 16px; margin-left: 10px;}
.performance-meet .profit .indicator.down img{ rotate: 180deg;}

.performance-meet .performance-stats{ padding: 50px 0 50px;}
.performance-meet .counter-con{ position: relative; padding: 0 25px; border-bottom: none; /* border-right: var(--color-white) 1px solid; */}
.performance-meet .counter-con::after{ content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 100%; background: var(--color-white);}
.performance-meet .counter-con:last-child{ border: none;}
.performance-meet .counter-con span{ line-height: 1;}
.performance-meet .counter-con .count{ font-size: 48px; color: var(--color-white);}
.performance-meet .counter-con p{ color: var(--color-white); padding: 5px 0 0;}
.performance-meet .counter-con .rs{ font-size: 26px;}
.performance-meet .counter-con .unit{ font-size: 26px;}
.performance-meet .globe{ position: absolute; right: 8%; bottom: 38%; width: 120px; height: 120px; background: var(--color-black); border-radius: 100px; overflow: hidden; box-shadow: -20px -10px 40px rgba(225, 255, 255, .1);}
.performance-meet .globe .earth-bg{ position: absolute; right: 0; top: 0; width: auto; max-width: none; height:auto;}
.performance-meet .globe:after{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/earth-overlay.png) top left no-repeat; background-size: contain;}

.director-message{ position: relative;}
.director-message .msg-panel{ position: absolute; right: 10%; top: 50%; transform: translateY(-50%); width: 46.15%;}
.director-message .msg-det-inner{ width: 100%; background: var(--color-white); padding: 60px 100px;}
.director-message .hm-sect-tl{ text-align: left; padding-bottom: 25px;}
.director-message .msg-con{ position: relative; padding: 30px 0 0; border-top: #818181 1px solid;}
.director-message .msg-con::before, .director-message .msg-con::after{ content: ''; position: absolute; top: -6px; width: 12px; height: 12px; background: var(--color-red); border-radius: 50px;}
.director-message .msg-con::before{ left: 0;}
.director-message .msg-con::after{ left: 15px;}
.director-message .msg-con p{ font-family: var(--font-Roboto); font-size: 20px; color: var(--color-black); font-weight: 400; line-height: 1.3;}
.director-message .msg-con h4{ font-family: var(--font-Roboto); padding: 10px 0 5px;}
.director-message .msg-con .dir-des p{ font-size: 18px; color: #585858; padding: 0;}
.director-message .link-list{ display: flex; flex-direction: row; align-items: center; justify-content: space-between; padding: 50px 0 0;}

.kep-hld{ padding: 30px 0 0;}
.kep-hld .graph-hld { padding-bottom: 20px; }
.kep-hld .graph-blurb{ margin-bottom: 0;}
.kep-hld .note-hld p { font-size: 12px; color: #4c4d4f; font-weight: 400; line-height: 1.3; padding: 0; }
.kep-hld .swiper-pagination{ position: relative; padding-bottom: 10px;}
.kep-hld .btn-redirect{ justify-content: center; padding: 20px 0 30px;}

.hm-strategy{ position: relative; overflow: hidden;}
.hm-strategy .hm-sect-tl{ text-align: left; padding-bottom: 30px;}
.hm-strategy .hm-sect-tl h2, .hm-strategy .hm-sect-tl h3{ color: var(--color-white);}
.hm-strategy figure{ position: relative; padding-bottom: 43.75%; }
.hm-strategy .strategy-det-hld{ position: absolute; right: 8%; top: 20%; width: 45%;}
.hm-strategy .strategy-det-hld p{ color: var(--color-white);}
.hm-strategy .strategy-listing{ padding: 30px 0 50px;}
.hm-strategy .swiper-slide{ height: 100%;}
.hm-strategy .strategy-blurb{ display: flex; flex-direction: row; align-items: center; justify-content: space-between; min-height: 120px; padding: 20px; background: #FFFFFF1A; backdrop-filter: blur(20px)}
.hm-strategy .strategy-blurb .icon{ width: 65px; }
.hm-strategy .strategy-blurb p{ width: calc(100% - 90px); padding-bottom: 0;}
.hm-strategy .swiper-pagination{ text-align: left;}
.hm-strategy .hm-read-more{ color: var(--color-white); margin-top: 30px;}

.esg-focus-hld{ position: relative;}
.esg-focus-hld figure{ position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 100%; height: 100%;}
.esg-focus-hld .esg-hld{ width: 100%; padding: 150px 0 250px;}
.esg-focus-hld .hm-sect-tl{ text-align: left; padding-bottom: 30px;}
.esg-focus-hld p{ padding-bottom: 30px;}

.intercept-hld{ position: relative; width: 500px; height: 500px; margin: 0 auto; /* border: var(--color-black) 1px solid; */ }
.intercept-hld .circle{ position: absolute; width: 54.6%; height: 54.6%; background: #FEEBC780; border-radius: 100%;}
.intercept-hld .intercept-blurb{ position: absolute; width: 100%; max-width: 100px; text-align: center;}
.intercept-hld .intercept-blurb .icon{ width: 62px; margin: 0 auto;}
.intercept-hld .intercept-blurb p{ padding: 10px 0 0;}
.intercept-hld .circle:nth-child(1){ left: 50%; top: 0; transform: translateX(-50%);}
.intercept-hld .circle:nth-child(1) .intercept-blurb{ left: 50%; top:21%; transform: translateX(-50%);}
.intercept-hld .circle:nth-child(2){ left: 1%; bottom: 12%; }
.intercept-hld .circle:nth-child(2) .intercept-blurb{ left: 20%; bottom: 20%;}
.intercept-hld .circle:nth-child(3){ right: 1%; bottom: 12%; }
.intercept-hld .circle:nth-child(3) .intercept-blurb{ right: 20%; bottom: 20%;}
 
.hm-awards{ background: #F2F2F3;}
.award-hld{ width: 100%; max-width: 1200px; margin: 0 auto; padding: 50px 0 70px;}

.pcg-hld{ position: relative; background: #FFF8E9;}
.pcg-hld .accordion-item, .pcg-hld .accordion-item .accordion-button{ border: none; border-radius: 0!important;}
.pcg-hld .accordion-item{ margin-bottom: 10px; background: none; background: #FFF8E9;}
.pcg-hld .accordion-item .accordion-button{ font-family: var(--font-Roboto); font-size: 20px; color: var(--color-black); font-weight: 500; text-transform: uppercase; padding: 20px 20px; background: #FFD886; box-shadow: none;}
.pcg-hld .accordion-item .accordion-button:not(.collapsed){ color: var(--color-red); box-shadow: none; pointer-events: none;}
.pcg-hld .accordion-item .accordion-button::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
  transition: all 0.5s;
}
.pcg-hld .accordion-item .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E");
}
.pcg-hld .accordion-item .accordion-button::after { transition: all 0.5s; }
.pcg-hld .accordion-item h2{ width: 75%;}
.pcg-hld .accordion-body{ padding: 10px 0 0; }
.pcg-hld .hm-sect-tl{ text-align: left; padding-bottom: 30px;}

.pcg-hld .acc-det-panel{ position: absolute; right: 0; top: 0; width: 50%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 50px 60px; background: #FFF8E9; transition: all 1s ease-out;}
.pcg-hld .counter-panel{ padding-top: 30px; padding-bottom: 30px;}
.pcg-hld .counter-con{ padding: 0 ; border: none;}
.pcg-hld .counter-con .count{ font-size: 28px;}
.pcg-hld .counter-con .count .unit{ font-size: 20px;} 
.pcg-hld .counter-con p{ font-size: 18px; color: #585858;}

.story-hld{ position: relative; width: 100%; height: 100vh;}
.story-hld .story-blurb{ position: relative; width: 100%; height: 100%;}
.story-hld .story-banner{ position: relative; width: 100%; height: 100%; overflow: hidden;}
.story-hld .story-banner figure{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.story-hld .story-banner .rocket{ position: absolute; right:20%; bottom: 0; width: 50%;/*  rotate: 6deg; */}
.story-hld .story-blurb .container{ position: absolute; left: 50%; top: 0; transform: translateX(-50%); height: 100%;}
.story-hld .story-det{ position: absolute; left: 20px; top: 15%; }
.story-hld .story-det .hm-sect-tl{ text-align: left; padding-bottom: 30px;}
.story-hld .story-det h2{ color: var(--color-yellow);}
.story-hld .story-det p{ color: var(--color-white); line-height: 1.5;}
.story-hld .pagination-hld{ position: absolute; left: 50%; bottom: 12%; transform: translateX(-50%); text-align: left; z-index: 1;} 
.story-hld .swiper-pagination{ position: relative; text-align: left;}
.story-hld .hm-read-more{ color: var(--color-white); margin-top: 30px;}
.story-hld figure.gallaxy{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1.1); height: auto; }
.story-hld .gallaxy img{  animation: rotate 13s linear infinite; animation-duration: 150s; animation-iteration-count: infinite;  animation-timing-function: ease-in-out; }
.story-hld .star{ position: absolute; left: 33.5%; top: 16%; width: 26%; }
/* .story-hld .star img{ animation: zoom-in-zoom-out 5s ease-out infinite;} */
@keyframes rotate {
  from {transform: rotate(0deg);  }
  to   {transform: rotate(360deg);  }
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.2, 1.2);
  }
  100% {
    transform: scale(1, 1);
  }
}

.story-hld .star img{width: 100%; height: 100%; object-fit: contain; animation: glitter 6.5s linear 0s infinite normal;}
@keyframes glitter {
	0%   { transform: scale(1.0) rotate(0deg); opacity: 1 ; }
	25%  { transform: scale(0.7) rotate(5deg); opacity: 0.3; }
	50%  { transform: scale(1.0) rotate(0deg); opacity: 1; }
	75%  { transform: scale(0.7) rotate(5deg); opacity: 0.3; }
	100% { transform: scale(1.0) rotate(0deg); opacity: 1; }
}
.download-center .download-hld{ padding: 0 3%;}
.download-center span{ padding-right: 10px;} 
/* .report-cover p{ font-size: 0.87rem; color: $site-color; padding: 5px 0 0;} */
.download-center .reports-links{ display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; align-content: center; height: 100%; padding: 0 0 0 11%;}
.download-center .reports-links li{ width: 46%; }
.download-center .reports-links svg{ width: 15px; height: 15px;}
.download-center .reports-links a{ position: relative; display: flex; flex-direction: row; align-items: center; justify-content: space-between; min-height: 90px; font-family: var(--font-Roboto); font-size: 20px; color: var(--color-black); line-height: 1; font-weight: 400; padding: 15px 0px; border-bottom: #C0C0C0 1px solid; }
.download-center .reports-links a::after{ content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: var(--color-red); transition: all .2s ease-out;}
.download-center .reports-links a span{ display: block; width: calc(100% - 60px);}
.download-center .reports-links a .arrow{ display: flex; flex-direction: row; align-items: center; justify-content: center; width: 30px; height: 30px; background: var(--color-yellow); border-radius: 100px; transition: all .2s ease-out;}
.download-center .reports-links a .arrow img{ width: 20px;}
.download-center .reports-links a:hover .arrow{ transform: translateX(-5px); transition: all .2s ease-out; } 
.download-center .reports-links a:hover::after{ width: 100%; transition: all .2s ease-out;}

footer .stirrup-logo{ width: 20px;}

 
/* Responsive Code */
@media handheld, only screen and (max-width: 1680px){
  .container, .home-page .container{ max-width: 1300px;}
  h5{ font-size: 18px;}
  p, .home-page p{ font-size: 16px;}
  .com-list li{ font-size: 16px;}
  .page-intro{ font-size: 20px;}
  .oc-panel .oc-details{ padding: 20px;}
  .oc-panel li{ font-size: 16px;}
  .hm-sect-tl h2{ font-size: 42px;}
  #banner h1{ font-size: 68px;}
  #banner .report-link{ font-size: 20px;}
  .download-center .download-hld{ padding: 0;}
  .download-center .reports-links a{ font-size: 18px;}
  .director-message .msg-panel{ padding: 40px 50px;}
  .hm-strategy .strategy-det-hld{ right: 5%; top: 15%; width: 50%;}
  .pcg-hld .accordion-item .accordion-button{ font-size: 18px;}
  .pcg-hld .acc-det-panel{ padding: 50px 40px;}
  .director-message .msg-det-inner{ padding: 60px 20px;}
  .hm-read-more{ font-size: 16px;}
  .hm-read-more span{ width: 25px; height: 25px;}
}
@media handheld, only screen and (max-width: 1440px){
  .home-page p{ font-size: 18px;}
  .container, .home-page .container{ max-width: 1200px;}
  #banner h1{ font-size: 58px; padding: 0 0 40px;}
  #banner .report-link{ font-size: 18px;}
  .director-message .msg-panel{ width: 50%; right: 5%;}
  .director-message .msg-con p{ font-size: 18px;}
  .hm-strategy .strategy-listing { padding: 15px 0 50px; }
  .hm-strategy figure{ padding-bottom: 46%;}
  .hm-strategy .strategy-det-hld{top: 10%; }
  .hm-strategy .strategy-blurb p { width: calc(100% - 80px); } 
  .pcg-hld .acc-det-panel { padding: 50px 20px; }
  .pcg-hld .accordion-item .accordion-button{ padding: 15px;}
  .pcg-hld .counter-con p{ font-size: 16px;}
  .performance-meet .globe{ width: 90px; height: 90px;}
}

@media handheld, only screen and (max-width: 1100px){
  .container, .home-page .container{ max-width: 1000px;}
  .page-intro br{ display: none;}
  .bod-hld .bod-info h4{ font-size: 20px;}
  .hm-sect-tl h2{ font-size: 36px;}
  .download-center .reports-links a{ font-size: 16px;}
  .hm-strategy{ height: auto;}
  .hm-strategy figure{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0;}
  .hm-strategy .strategy-det-hld{ position: relative; right: auto; top: auto; width: 100%; padding: 50px 50px; margin: 0 auto;}
  .pcg-hld .acc-det-panel { top: 5%; padding: 20px 20px; }
  
}

@media handheld, only screen and (max-width: 1024px){
  .section{ padding: 60px 0;}
  header nav .container{ width: 100%; padding: 0;}
  header .nav-hld{ display: block; height: 100vh; padding: 60px 20px; overflow: hidden; overflow-y: scroll;}
  .nav-icon.open{ background: none;}
  .lt-team .lt-info-2{ text-align: left;}
  .lt-team p br{ display: none;}
  .hm-sect-tl h2{ font-size: 38px;}
}
@media handheld, only screen and (max-width: 991px){
  .strategic-diretion{ padding-top: 50px;}
  .board-list{ padding: 20px 20px;}
  .board-list::before{ display: none;}
  .board-list li{ font-size: 16px; line-height: 1.2;}
  .board-list li::before{ top: 3px;}
  .risk-hld .risk-blurb{ padding-bottom: 30px;}
  .oc-panel .oc-details{ width: calc(100% - 32px); margin: 0 auto;}
  .our-journey-hld .journey-desc h5 br, .our-journey-hld .journey-desc p br{ display: none;}
  .esg-priorities-chart{ flex-direction: column;}
  .esg-priorities-chart::before{ left: 0; top:50%; transform: translate(0); transform: translateY(-50%); width: 1px; height: 80%; }
  .chart-blurb{ width: 100%; text-align: left; padding: 15px 0 15px 70px;}
  .chart-blurb::before{ left: 0; top:50%; transform: translate(0); transform: translateY(-50%); width: 50px; height: 1px; }
  .chart-blurb::after{ left: 50px; top:50%; transform: translateY(-50%); }
  .journey-core-values .core-value-hld{ text-align: left;}
  .strategy-hld .graph-con ul{ width: 90%;}

  .hm-sect-tl h2{ font-size: 32px;}
  .hm-sect-tl h3{ font-size: 16px;}
  .home-header header{ background: var(--color-white);}
  #banner .banner-video-desk{ display: none;}
  #banner .banner-video-mob{ display: block;}

  #banner .banner-det{ top: auto; transform: translate(0); bottom: 10%;}
  .director-message{ padding-bottom: 0px;}
  .director-message .msg-panel{ position: relative; right: auto; top: auto; transform: translate(0); width: 100%; padding: 40px 20px;}
  .esg-focus-hld .esg-hld{ padding: 100px 0; }
  .intercept-hld{ width: 400px; height: 400px;}
  .pcg-hld .acc-det-panel { position: relative; top: auto; right: auto; width: 100%; padding: 30px 20px 40px; }
  .pcg-hld .accordion-item h2{ width: 100%;}

  .story-hld .story-banner .rocket{ right: 4%; bottom: 0; width: 92%;}
  .story-hld figure.gallaxy{ transform: translate(-50%, -50%) scale(1.8);}
}
@media handheld, only screen and (max-width: 767px){
  .inner-pages{ padding-top: 68px;}
  .page-intro{ line-height: 1.3;}
  header .logo{ max-width: 170px;}
  .sect-tl h3{ font-size: 18px;}
  .sect-tl h2{ font-size: 40px;}
  .graph-con ul{ padding: 50px 10px 0;}
  .counter-hld{ padding: 0;}
  .counter-con .count{ font-size: 32px;}
  .counter-con .unit{ font-size: 22px;}
  .counter-con p{ line-height: 1.2;}
  .number-bullet-hld{ text-align: left; padding: 0;}
  .number-bullet-hld::before{ width: 1px; height: 80%; left: 42px; top: 40px; transform: translate(0); }
  .number-bullet-hld .number-bullet{ display: flex; flex-direction: row; align-items: center; padding: 20px 0;}
  .number-bullet-hld .number{ margin: 0;}
  .number-bullet-hld p{ padding: 0 0 0 20px;}
  .case-study{ margin-top: 60px;}
  .inner-banner.inner-banner-hld figure { padding-bottom: 56%; }
  .our-journey-hld .year{ font-size: 18px;}
  .our-journey-hld .journey-desc h5{ padding: 5px 0;}
  .journey-core-values .value-tl{ width: 100%; max-width: 235px; font-size: 18px;}
  .hm-strategy .strategy-det-hld{ padding: 50px 20px;}
  .intercept-hld .intercept-blurb .icon{ width: 42px;}
  #banner h1{ font-size: 44px;}
  .download-center .download-hld{ padding: 30px 0 0;}
  .download-center .reports-links{ flex-direction: column; padding: 20px 0 0;}
  .download-center .reports-links li{ width: 100%;}
  .download-center .reports-links a{ min-height: 70px;}
  .performance-meet .counter-con .count{ font-size: 32px;}
  .performance-meet .counter-con .unit, .performance-meet .counter-con .rs{ font-size: 22px;}
}
@media handheld, only screen and (max-width: 575px){
  .home-page p{ font-size: 16px;}
  .section{ padding: 50px 0;}
  .sect-tl h3{ font-size: 16px;}
  .sect-tl h2{ font-size: 34px;}
  .sect-tl h2 br{ display: none;}
  .case-study .cs-heading h5{ font-size: 20px;}
  .awards-hld{ border: 5px var(--color-red) solid;}
  .inner-banner.inner-banner-hld figure { padding-bottom: 65%; }
  .esg-pillars .piller-list{ flex-direction: column; text-align: center; padding: 20px 20px;}
  .esg-pillars .icon{ margin: 0 auto 20px;}
  .strategy-hld .graph-con ul{ width: 40%;}
  .strategy-hld .tag-line .icon{ width: 75px;}
  .hm-sect-tl h2{ font-size: 32px;}
  .hm-read-more{ font-size: 16px;}
  .hm-read-more span{ width: 25px; height: 25px; margin-left: 10px;}
  .home-page .swiper-pagination-bullet{ width: 20px; height: 5px;}
  .home-page .swiper-pagination-bullet-active{ width: 30px; background: var(--color-yellow); transition: all .2s ease-out;}
  #banner h1 { font-size: 42px; }
  .director-message .link-list{ flex-direction: column; align-items: flex-start; padding: 20px 0 0;}
  .director-message .msg-con p{ font-size: 16px;}
  .director-message .hm-read-more{ margin-bottom: 10px;}
  .director-message .msg-con h4{ font-size: 18px;}
  .director-message .msg-con .dir-des p{ font-size: 16px;}
  .intercept-hld{ width: 300px; height: 300px; margin-top: 30px;}
  .performance-meet .counter-con{ padding: 0 15px;}
  .story-hld .story-det{ left: 0; padding: 0 20px;}
  .story-hld .story-det p br{ display: none;}
  .story-hld .story-banner .rocket{ right: 2%; bottom: 0; width: 83%;}
  .story-hld figure.gallaxy{ transform: translate(-50%, -50%) scale(2.1);}
  .performance-meet .globe { width: 60px; height: 60px; }
}
@media handheld, only screen and (max-width: 400px){
 
}
@media handheld, only screen and (max-width: 360px){
  #banner h1 { font-size: 38px; }
  #banner .report-link{ font-size: 16px;}
}