@media(max-width:1200px) {}

@media(max-width:1024px) {
  }
@media (max-width: 991px) {

/* ===== Top-nav mobile accordion (.my-sidenav1.is-accordion) ===== */
.my-sidenav1.is-accordion {
  top: 0;                       /* cover full screen — no white gap at the top */
  height: 100vh;
  background: #0067AC;          /* single solid colour, drop the split green */
  padding-top: 70px;            /* clear the fixed header/close button */
}
.my-sidenav1.is-accordion .container,
.my-sidenav1.is-accordion .row { display: block; margin: 0; }
.my-sidenav1.is-accordion [class*="col-"] {
  width: 100%; max-width: 100%; flex: 0 0 100%; padding: 0;
}
.my-sidenav1.is-accordion .offset-xl-2 { margin-left: 0; }
.my-sidenav1.is-accordion .top-nav { padding-top: 0; }
.my-sidenav1.is-accordion .top-nav-content { display: contents; }  /* panels live under topics */

/* Each topic = accordion header */
.my-sidenav1.is-accordion .top-nav .nav-pills > li {
  border-bottom: 1px solid rgba(255,255,255,0.25);
}
.my-sidenav1.is-accordion .top-nav .nav-pills > li > a {
  position: relative;
  display: block;
  padding: 16px 34px 16px 0;
  margin: 0;
  cursor: pointer;
}
/* Chevron indicator that rotates when open */
.my-sidenav1.is-accordion .top-nav .nav-pills > li > a::after {
  content: "";
  position: absolute;
  right: 6px;
  top: 22px;
  width: 16px;
  height: 16px;
  background: currentColor;
  transition: transform .3s ease;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}
.my-sidenav1.is-accordion .top-nav .nav-pills > li > a.active::after {
  transform: rotate(180deg);
}
/* hide the desktop yellow tick marker on mobile */
.my-sidenav1.is-accordion .top-nav .nav-pills > li.active > a:after,
.my-sidenav1.is-accordion .top-nav .nav-pills > li > a.active:after { }

/* Panel (sub-links) nested under a topic */
.my-sidenav1.is-accordion .acc-panel {
  display: none;
  padding: 0 0 14px 12px;
}
.my-sidenav1.is-accordion .acc-panel .row,
.my-sidenav1.is-accordion .acc-panel [class*="col-"] { display: block; width: 100%; max-width: 100%; }
.my-sidenav1.is-accordion .acc-panel .sub-menu { margin-top: 0; list-style: none; padding-left: 0; }
.my-sidenav1.is-accordion .acc-panel li { padding-bottom: 12px; list-style: none; }
.my-sidenav1.is-accordion .acc-panel a { color: #ffffff; font-size: 15px; opacity: 0.92; }
.my-sidenav1.is-accordion .acc-panel .vd-top-img { display: none; }  /* hide banner image inside accordion */

#tab_selector,
#tab_selector1,
.l-tab-mbl
{
  border: 1px solid #3564af;
  width: 100%;
  padding-bottom: 5px;
  display: block;
  margin-bottom: 30px;
  color: #004497;
  font-size: 18px;
  padding: 12px 15px;
  appearance: none;
  background: url(../images/s-down-arrow.png) !important;
  background-position-x: 0%;
  background-position-y: 0%;
  background-repeat: repeat;
  background-repeat: no-repeat !important;
  background-position: 95% 50% !important;
  margin-top:0px;
  display: inline-block;
}
select:focus-visible
{
  outline: none;
  box-shadow: none;
}
.desktopHam {
  display: none;
}

.logoArea a img {
  width:100%;
}

.ham-icon1 {
  display:block;
}

.my-sidenav {
  width: 0px;
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  overflow-x: hidden;
  z-index: 999999999;
  height: 100vh;
  max-width: 0px;
  width: 100%;
  background-color: #0067AC;
  transition: 0.5s;
  -webkit-transition: 0.5s;
}

.my-sidenav>ul {
  padding: 0px 20px 0px;
}

.my-sidenav>ul>li>ul {
  margin-top: 0px;
  display: none;
}

.my-sidenav ul.submenu li ul.submenu {
  display: none;
  position: static;
  width: 100%;
}

.my-sidenav ul {
  list-style-type: none;
  padding-left: 15px;
}

.my-sidenav ul li {
  border-bottom: 1px solid #ffffff;
  padding: 15px 0px;
}

.my-sidenav>ul>li>ul>li {
  border-bottom: 1px solid #ffffff;
  padding: 10px 0px;
}

.my-sidenav>ul>li>ul>li:last-child,
.my-sidenav ul.submenu li ul.submenu li:last-child {
  border-bottom: 0px;
}

.my-sidenav ul.submenu li ul.submenu li {
  border-bottom: 1px solid #ffffff;
  padding: 10px 10px;
}

.my-sidenav ul.submenu li ul.submenu li a {
  color: #ffffff;
  font-size: 16px;
}

.cross-btn1 {
  text-align: right;
  padding: 16px 14px 0px 0px;
  color: #fff;
  font-size: 35px;
  cursor: pointer;
}

/* Chevron indicator (like the SRF reference): a down-arrow that rotates 180deg when open */
.my-sidenav .submenu-indicator {
  position: absolute;
  right: 8px;
  top: 50%;
  width: 18px;
  height: 18px;
  font-size: 0;                 /* hide the plugin's "+" text */
  transform: translateY(-50%);
  transition: transform .3s ease;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}

.my-sidenav .submenu-indicator-minus .submenu-indicator {
  transform: translateY(-50%) rotate(180deg);
}

.my-sidenav>ul>li>a {
  color: #ffffff;
  font-size: 20px;
  display: block;
  position: relative;
  padding-right: 32px;   /* reserve space so the chevron never overlaps the text */
}

.my-sidenav>ul>li>ul>li>a {
  color: #ffffff;
  font-size: 16px;
}

.my-sidenav>ul>li>ul>li>a img {
  padding-right: 0;
  float: right;
  padding-left: 50px;
}

.l-tab-mbl
{
  display: block;
}
#myTab,
#vc-tab,
#key-tab,
#vcTab
{
  display: none;
}
.top-menu ul
{
  display: none;
}
.v-t3
{
  display: block;
}
.v-t1, .v-t2
{
  display: none;
}
}
@media(max-width:767px) {
  
  #wrapper
  {
    overflow-x: hidden !important;
  }
  .left-menu
  {
    display: block;
  }
  .right-menu
  {
    padding-left: 20px;
    height: 60px;
  }
  #header .row, #header:after
  {
    height: 60px;
  }
  .es-diagram-img1 img 
  {
    max-width: 100%;
  }
  .ch-flex
  {
    display: block;
  }
  /* Non-Executive Director's Message: image on top, text below (mobile) */
  .dir-msg .ch-flex { display: flex; flex-direction: column; }
  .dir-msg .ch-left { order: -1; }
  /* Capital Highlights: Key FY 2025-26 outcomes -> 2-column on mobile */
  .ch-numbers { grid-template-columns: repeat(2, 1fr); }
  /* Zinc India */
  .zi-awards-list { columns: 1; }
  .zi-assetbox .tc-bu-list { grid-template-columns: 1fr; gap: 14px 0; }
  .zi-banner-icon { width: 48px; height: 48px; }
  .zi-callout { font-size: 16px; line-height: 24px; padding:0px; }
}
@media (max-width: 480px) {}

@media (max-width: 380px) {}

/* ===================== Project responsive overrides ===================== */
@media (max-width: 991px) {
  .awards-pagehead { padding: 110px 0 20px; }
  .awards-pagehead .ch-breadcrumb { margin-bottom: 18px; }
  .awards-key-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .awards-key-graphic { grid-column: 1 / -1; grid-row: 2;
     /* max-width: 320px; */
   }
  .awards-key-copy--tl,
  .awards-key-copy--ml,
  .awards-key-copy--bl,
  .awards-key-copy--tr,
  .awards-key-copy--br {
    grid-column: auto;
    grid-row: auto;
    justify-self: stretch;
    max-width: none;
    text-align: left;
  }
  .awards-category-section { padding: 18px 0 26px; }
  .awards-category-block { padding: 12px 0 20px; }
  .awards-category-head { font-size: 20px; line-height: 24px; }
  .awards-category-list li { font-size: 15px; line-height: 22px; margin-bottom: 10px; }
  .stakeholder-community-strip p { font-size: 18px; line-height: 24px; }
  .stakeholder-community-body { padding: 30px 15px 36px; }
  .stakeholder-community-overview { margin-bottom: 30px; }
  .stakeholder-community-overview h3,
  .stakeholder-community-col h3 { font-size: 20px; line-height: 26px; }
  .stakeholder-community-overview p { font-size: 16px; line-height: 26px; }
  .stakeholder-community-col li { font-size: 16px; line-height: 26px; }
  .stakeholder-community-compare { padding-top: 20px; }
  .stakeholder-community-panel li { font-size: 16px; line-height: 24px; }
  .stakeholder-community-panel li::before { font-size: 24px; line-height: 24px; }
  .stakeholder-community-outcomes { padding-top: 32px; }
  .stakeholder-community-stat { min-height: 0; }
  .stakeholder-community-stat-val { font-size: 30px; line-height: 34px; }
  .stakeholder-community-stat-val .counter { font-size: 30px; line-height: 34px; }
  .stakeholder-community-unit { font-size: 18px; line-height: 22px; }
  .stakeholder-community-bottom { padding-top: 22px; }
  .stakeholder-community-capital { font-size: 28px; }
  .stakeholder-group-icon img { width: 62px; height: 62px; }
  .stakeholder-community-icon img { width: 56px; height: 56px; }
  .pc-block-inner { padding: 0; }
  .peopleCulturePage .pc-title { font-size: 22px; line-height: 28px; } 
  .peopleCulturePage .pc-stat-text { font-size: 16px; line-height: 24px; }
  .pc-feature-copy { padding: 30px 18px 20px 0; }
  .pc-feature-media { min-height: 320px; }
  .pc-profile-block { margin-bottom: 28px; }
  .pc-expert-head { margin-top: 8px; margin-bottom: 0; }
  .pc-expert-stat-val,
  .pc-expert-stat-val .counter { font-size: 30px; padding-top: 20px; }
  .pc-aspire-stats { grid-template-columns: 1fr; }
  .pc-aspire-stat-val,
  .pc-aspire-stat-val .counter { font-size: 30px; }
  .pc-growth-stat-val,
  .pc-growth-stat-val .counter { font-size: 30px; }
  .pc-nextgen-stat-val,
  .pc-nextgen-stat-val .counter,
  .pc-nextgen-unit { font-size: 30px; }
  .pc-internship-metrics { grid-template-columns: 1fr; }
  .pc-internship-stat-val .counter,
  .pc-internship-unit,
  .pc-internship-metric-val .counter,
  .pc-internship-metric-label { font-size: 30px; }
  .pc-awards-head-title { font-size: 20px; line-height: 26px; }
  .pc-awards-row { padding-top: 22px; }
  .pc-awards-icon { width: 72px; min-width: 72px; }
  .cg-intro-text { font-size: 16px; line-height: 26px; }
  .cg-title { font-size: 20px; line-height: 26px; }
  .cg-framework-card { padding: 28px 18px 22px; }
  .cg-framework-icon { width: 60px; height: 60px; font-size: 30px; }
  .cg-framework-label { font-size: 16px; line-height: 22px; }
  .cg-board-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .cg-board-table { min-width: 760px; }
  .cg-pie-title { font-size: 16px; line-height: 22px; }
  .cg-esg-copy { padding-left: 0; margin-top: 18px; }
  .cg-ratings-grid { grid-template-columns: 1fr; }
  .cg-rating-card { padding: 20px 16px 18px; }
  .cg-oecd-card-title { font-size: 18px; line-height: 24px; }
  .cg-oecd-list li { font-size: 15px; line-height: 22px; }
  .pc-growth-stat-val,
  .pc-growth-stat-val .counter { font-size: 30px; }
  .it-vc-card { padding: 28px 22px; }
  .it-activity { gap: 20px; }
  .it-strategic { grid-template-columns: 1fr; row-gap: 14px; }
}

@media (max-width: 575px) {
  .awards-pagehead { padding: 100px 0 30px; }
  .awards-key-section { padding: 16px 0 28px; }
  .awards-key-grid { grid-template-columns: 1fr; gap: 20px; }
  .awards-key-graphic { grid-column: auto; grid-row: auto;
     /* max-width: 260px; */
     }
  .awards-key-copy,
  .awards-key-copy--tl,
  .awards-key-copy--tr,
  .awards-key-copy--ml,
  .awards-key-copy--bl,
  .awards-key-copy--br {
    text-align: center;
  }
  .awards-category-section { padding: 14px 0 22px; }
  .awards-category-block { padding: 10px 0 18px; }
  .awards-category-head { font-size: 18px; line-height: 22px; padding: 7px 18px; }
  .awards-category-list li { font-size: 14px; line-height: 21px; padding-left: 18px; }
  .awards-category-list li::before { top: 8px; width: 6px; height: 6px; }
  .pc-internship-metrics { grid-template-columns: 1fr; }
  .pc-awards-head-title { font-size: 20px; line-height: 26px; }
  .pc-awards-row { padding-top: 22px; }
  .pc-awards-icon { width: 72px; min-width: 72px; }
  .cg-board-table { min-width: 700px; }
  .cg-oecd-section { padding: 10px 0 26px; }
  .cg-oecd-card { padding-bottom: 12px; }
  .cg-oecd-card-title { font-size: 17px; line-height: 23px; }
  .cg-oecd-list { padding-left: 16px; }
  .cg-oecd-list li { font-size: 14px; line-height: 21px; }
  .cg-ratings-title { font-size: 18px; line-height: 24px; }
  .cg-rating-card { padding: 18px 14px 16px; }
  .cg-rating-logo { min-height: 80px; }
  .cg-rating-main h3 { font-size: 17px; line-height: 22px; }
  .cg-rating-points li { font-size: 14px; line-height: 21px; }
}

/* ===================== Mobile responsive pass ===================== */
@media (max-width: 991px) {
  /* --- Banner --- */
  .topBanner h1 { font-size: 34px; line-height: 38px; }
  .topBanner h1 span { font-size: 24px; }
  .banner-text {
    left: 24px;
    margin-left: 0;
    bottom: auto;
    top: 110px;
    max-width: 100%;
    padding-right: 24px;
  }
  .banner-caption {
    left: 24px;
    margin-left: 0;
    bottom: 4%;
    padding-right: 24px;
  }
  .banner-caption p { font-size: 11px; line-height: 16px; letter-spacing: 1px; }

  /* --- Global section headings --- */
  .hm-mainhead { font-size: 26px; line-height: 30px; padding-bottom: 20px; }
  .hm-smallhead { font-size: 20px; line-height: 26px; }
  .allHeads h3, .downloadCenter h3, .allReport ~ * .hm-mainhead { font-size: 24px; line-height: 28px; }

  /* --- hm-ch / chairman: remove custom follow-cursor arrow on touch/mobile --- */
  .cursor-arrow { display: none !important; }

  /* --- hm-ch 50/50 split -> stack --- */
  .leader-slider .item { flex-direction: column; }
  .ch-left, .ch-right { width: 100%; height: auto;         display: block;
        padding: 30px 15px 0px; }
  .ch-left { padding:30px 20px 0px 20px; }

  /* --- glance: GSAP animation does not run <=1025px, so reveal content statically --- */
  .glance-img-wrap { height: auto; flex-direction: column; }
  .glance-img {
    position: relative;
    height: 260px;
    transform: none !important;
    opacity: 1 !important;
  }
  .v-t1, .v-t2 { transform: none !important; }
  .glance-text1 { position: relative; top: auto; opacity: 1 !important; font-size: 22px; line-height: 28px; padding: 20px 16px; color:#0067ac; }
  .glance-text1 span { font-size: 26px; }
  .glance .container { position: relative; left: auto; transform: none; bottom: auto; }
  .glance-num-wrap { opacity: 1 !important; padding: 24px 20px; }
  .glance-num-wrap h4 { font-size: 20px; line-height: 26px; }

  /* --- capital highlights tab body padding --- */
  .stakeTabBody { padding: 30px 20px 20px; }

  /* --- case study accordion -> stack --- */
  .case-accordion { flex-wrap: wrap; height: auto; gap: 16px; }
  .case-accordion > div, .case-accordion > div.active5 { flex: 1 1 100%; height: 240px; }
  .case-accordion .case-text { display: block; }
  .glance
  {
    padding-top: 40px;
    margin-bottom: 40px;
  }
  .glance h3
  {
    padding-bottom: 10px;
  }
  .glance-num
  {
    border-right: none;
    margin-bottom: 20px;
  }
  .glance-row1 .glance-num {
    min-height: auto;
}
#vc-tab-a
{
  border-radius: 20px;
}
.next-preview
{
  display: none;
}
.hm-keysec
{
  padding-top: 40px;
}
.keytabcontent h6 {
    padding-top: 0px;
}
}

@media (max-width: 767px) {
  .topBanner h1 { font-size: 28px; line-height: 32px; }
  .topBanner h1 span { font-size: 20px; }
  .hm-mainhead { font-size: 26px; line-height: 30px; }
  .banner-caption p { font-size: 10px; letter-spacing: 0.5px; }
  .stakeTabBody { padding: 24px 16px 16px; }

  /* --- Strategic Priorities: show only the centre item (hide side peeks) --- */
  .slider-3d .slick-list { padding: 0 !important; }

  /* --- Download Center: image on top, all 4 buttons stacked below --- */
  .downlaod-wrap { flex-direction: column; align-items: center; gap: 24px; }
  .d-image { width: 100%; text-align: center; }
  .d-buttons { width: 100%; }
  .report-preview { margin-bottom: 0; text-align: center; }
  .download-card { width: 100%; }

  /* --- Case Study: reduce gap between heading and cards --- */
  .case-study .hm-mainhead { padding-bottom: 20px; }
  .case-study1, .case-study3 { margin-top: 0; }

  /* --- Case Study: text below image (all cards), blue heading --- */
  .case-accordion > div,
  .case-accordion > div.active5,
  .case-study2, .case-study4 { height: auto; }
  .case-accordion div img { height:auto; }
  .case-accordion .case-text {
    display: block;
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    padding: 14px 0 4px;
  }
  .case-accordion > div::after { display: none; }
  .case-text h4 { color: #0067AC; padding-bottom: 12px; }
  .case-text .explore-btn a { display: inline-flex; align-items: center; gap: 8px; color: #fff; }
  .case-text .explore-btn a span {
    background: #0067AC;
    color: #fff;
    padding: 8px 20px;
    border-radius: 100px;
    font-size: 14px;
    font-family: roboto-medium;
  }

  .msgPart h3
  {
    font-size: 22px;
    line-height: 32px;
  }
  .msgPart h3 span
  {
    font-size: 26px;
    line-height: 30px;
  }
  .leaders-section {
    padding: 40px 0px;
    margin: 0px 15px;
}
.bod-slider
{
  padding-top: 0px;
}
.cap-img
{
  margin-top: 30px;
}
.vc-tabcontent p
{
  padding-bottom: 30px;
}
.cap-num p 
{
  padding-bottom: 0px;
}
#vc-tab-f
{
  border-radius: 20px;
}
.cap-num
{
  border-right: none;
}
.glance-num-wrap
{
background: transparent linear-gradient(220deg, rgba(0,102,170,0.85) 0%, rgba(114,191,68,0.85) 100%) 0% 0% no-repeat padding-box;
}
.keytabcontent h2
{
  padding-bottom: 30px;
}
.hm-keysec .slick-dots
{
  bottom:auto;
  position: relative;
  display: none !important;
}
.value-creation-section .vc-left
{
  padding: 40px 20px;
}
.vc-left h2
{
  font-size: 24px;
}
.vc-left h2 span
{
font-size: 26px;
}
.value-creation-section .l-tab-mbl
{
margin-bottom: 0px;
border-color: #ffffff;
background-color: #ffffff !important;
}
.tabtoptxt
{
  display: block;
}
.outcometxt
{
  margin-top: 20px;
}
.valuechainicon, .valuecoreicon {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}
.strategic-pr .card
{
  padding: 20px;
  margin:0px 15px;
}
.strategic-pr p
{
  font-size: 18px;
}
.strategic-pr {
    padding: 50px 0px 50px 0px;
    height: auto;
}
.repoting-wrap.active6 {
    height: auto;
}
.repoting-wrap {
    padding: 30px 20px;
    display: block;
  }
  .reporting-img
  {
    margin-bottom: 20px;
  }
  .downlaod-wrap
  {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .rdxDev p
  {
    text-align: left;
  }
  .footSocial
  {
    margin: 10px 0px;
  }
  .footSocial ul
  {
    justify-content: flex-start;
  }
}
/* ===== Our ESG Strategy ===== */
@media (max-width: 991px) {
  .es-section { padding-top: 40px; }
  .es-vedas-body { column-count: 1; }
}

/* ===== Our ESG Strategy: governance ===== */
@media (max-width: 991px) {
  .es-section-title { font-size: 24px; line-height: 28px; }
  .es-cop { grid-template-columns: repeat(3, 1fr); }
  .es-levels { grid-template-columns: 1fr; gap: 20px; }
  .es-board-members { gap: 20px; }

  /* Issues that mattered to the Board: stack card + single-column body */
  .es-issues { padding: 24px 20px 26px; }
  .es-issue-row { flex-direction: column; gap: 18px; }
  .es-issue-side { flex-direction: row; align-items: center; gap: 14px; align-self: stretch; padding: 14px 18px; }
  .es-issue-icon img { width: 34px; height: 34px; }
  .es-issue-label { margin-top: 0; }
  .es-issue-body { grid-template-columns: 1fr; gap: 6px; }
}
@media (max-width: 575px) {
  .es-cop { grid-template-columns: repeat(2, 1fr); }
  .es-list--2col { grid-template-columns: 1fr; }
}

/* ===== Our ESG Strategy: scorecard ===== */
@media (max-width: 991px) {
  .es-sc-group { font-size: 18px; }
}

/* ===== Transforming Communities ===== */
@media (max-width: 991px) {
  .tc-intro-grid { grid-template-columns: 1fr; gap: 22px; }
  .tc-levers { grid-template-columns: 1fr; gap: 22px; }
  .tc-navcards { grid-template-columns: 1fr; gap: 16px; }
  .tc-safety-cols { grid-template-columns: 1fr; }
  .tc-safety-col { border-right: 0; border-bottom: 1px solid #cfe0b8; }
  .tc-focus { grid-template-columns: 1fr; }
  .tc-focus-item { border-right: 0 !important; padding: 14px 0; }
  .tc-stats { grid-template-columns: 1fr 1fr; }
  .tc-stat { border-right: 0 !important; padding: 16px 0px; }
  .tc-stat:nth-child(2n+1) { padding-left: 0; }
  .tc-aim-grid { grid-template-columns: 1fr; gap: 8px; }
  .tc-strategy-cols { grid-template-columns: 1fr; gap: 22px; }
  .tc-split { grid-template-columns: 1fr; gap: 24px; }
  .tc-split-img { order: -1; }
  /* Nand Ghar: on mobile keep image below the two paragraphs (inside the section, not above the heading) */
  .tc-split--nandghar .tc-split-img { order: 1; }
  .tc-oversight { grid-template-columns: 1fr; padding: 8px 20px 20px; }
  .tc-ov-head { margin-top: 6px; }
  .tc-case-grid { grid-template-columns: 1fr; gap: 28px; }
  .tc-case-title { font-size: 22px; line-height: 28px; }
  .tc-aim { flex-direction: column; align-items: flex-start; gap: 14px; }
  .tc-aim-title { padding-left: 0; border-left: 0; }
}
@media (max-width: 575px) {
  .tc-stats { grid-template-columns: 1fr; }
  .tc-case-meta { gap: 12px 24px; }
}

/* ===== Strategic Priorities: arrow positions match centerPadding ===== */
@media (max-width: 992px) {
  .strategic-pr .slick-prev { left: 90px; }
  .strategic-pr .slick-next { right: 90px; }
}
@media (max-width: 767px) {
  /* Strategic Priorities: centre the prev/next arrows as a pair below the card, before the button */
  .strategic-pr .slider-3d { padding-bottom: 64px; }
  .strategic-pr .slick-prev,
  .strategic-pr .slick-next { top: auto; bottom: 8px; transform: none; }
  .strategic-pr .slick-prev { left: 50%; right: auto; margin-left: -48px; }
  .strategic-pr .slick-next { left: 50%; right: auto; margin-left: 8px; }

.ch-right {
        padding: 30px 15px 30px;
    }
.slick-prev11, .slick-next11
{
  top:20%;
}
.slick-next11 {
    right: 0px;
}
.slick-prev11
{
  left: 0px;
}
.leaders-section h2, .capital-highlights h2, .ourServices h3, .strategic-pr h2, .awards-head, 
.sp-head
{
    font-size: 22px;
}
.leaders-section h2 span, .capital-highlights h2 span, .ourServices h3 span,
.strategic-pr h2 span, .awards-head span, .sp-head span 
{
  font-size: 26px;
}
.hm-keysec h2
{
  font-size: 22px !important;
}
.hm-keysec h2 span
{
  font-size: 26px !important;
}
.key-flex
{
  display: block;
}
.key-graph
{
  margin-bottom: 30px;
}
.hm-keysec .explore-btn
{
  bottom:auto;
  position: relative;
}
.key-graph img
{
  margin: auto;
}
.graph-footnote
{
  margin-top: 0px;
  margin-bottom: 20px;
}
.hm-keysec
{
  padding-bottom: 10px;
}
.strategic-pr .glance-btn
{
  margin-top: 60px;
}
.msgPart h5, .hm-smallhead, .ourServices h6
{
  font-size: 18px;
}
.repoting-suite {
    padding-top: 50px;
}
.it-vc-block
{
  margin-bottom: 30px !important;
}
.it-readmore
{
  margin-bottom: 0px;
  margin-top: 20px !important;
}
.it-sec .it-readmore
{
  margin-bottom: 30px;
}
.it-pagination .container
{
  display: block;
}
.it-page-link
{
  display: flex;
  margin-bottom: 20px;
}
.it-page-next
{
  justify-content: flex-end;
  margin-left: auto;
}
.it-page-next .it-page-meta
{
  text-align: right;
  align-items: flex-end;
}
.ch-num-val
{
  font-size: 24px;
}
.ch-num-label
{
  margin-top:0px;
}
.ch-numbers {
    gap: 15px 20px;
  }
}
/* =========================================================
   New pages — responsive
   (About the Report / Reporting Suite / Vedanta at a Glance / Value chain)
   ========================================================= */
@media (max-width: 991px) {
  /* About the Report */
  .about-report-section { padding: 0px 0 50px; }
  .about-report-lead { font-size: 20px; line-height: 30px; margin-bottom: 40px; }
  .about-report-block { margin-bottom: 36px; }
  .about-report-block-title { font-size: 20px; line-height: 26px; }

  /* Our Reporting Suite */
  .reporting-suite-section { padding: 30px 0 50px; }
  /* Drop to 2 columns on tablet so the narrower 3-up cards don't get cramped.
     Each card spans 2 of 4 columns; reset the centered-row offset from desktop. */
  .reporting-suite-grid { grid-template-columns: repeat(4, 1fr); column-gap: 40px; }
  .reporting-suite-card { grid-column: span 2; }
  .reporting-suite-card:nth-child(4) { grid-column: span 2; }

  /* Vedanta at a Glance */
  .vedanta-glance-leading { padding: 50px 0; }
  .vedanta-glance-title { font-size: 22px; line-height: 30px; margin-bottom: 40px; }
  .vedanta-glance-stat-val { font-size: 38px; line-height: 44px; }
  .vedanta-glance-stat-val .vedanta-glance-stat-unit { font-size: 20px; line-height: 26px; }
  .vedanta-glance-overview { padding: 40px 0 50px; }

  /* Our value chain */
  /* .value-chain-section { padding: 50px 0 60px; }
  .value-chain-grid { gap: 32px 24px; }
  .value-chain-card {
    flex: 0 0 calc((100% - 24px) / 2);
    max-width: calc((100% - 24px) / 2);
  }
  .value-chain-card-num { font-size: 50px; }
  .value-chain-card-icon img { width: 60px; height: 60px; } */
}

@media (max-width: 767px) {
  /* Our Reporting Suite — single column; reset spans/offset from larger views */
  .reporting-suite-grid { grid-template-columns: 1fr; }
  .reporting-suite-card,
  .reporting-suite-card:nth-child(4) { grid-column: auto; }
  .reporting-suite-card { padding: 28px 0; }
}

@media (max-width: 575px) {
  /* About the Report */
  .about-report-lead { font-size: 18px; line-height: 27px; margin-bottom: 32px; }
  .about-report-block { margin-bottom: 30px; }
  .about-report-block-title { font-size: 18px; line-height: 24px; }
  .about-report-text { font-size: 15px; line-height: 24px; }
  .about-report-note { font-size: 15px; line-height: 24px; }

  /* Our Reporting Suite */
  .reporting-suite-company { font-size: 20px; line-height: 26px; }
  .reporting-suite-cover { width: 96px; }
  .reporting-suite-card-body { gap: 16px; }

  /* Vedanta at a Glance */
  .vedanta-glance-grid { grid-template-columns: repeat(2, 1fr); gap: 30px 18px; }
  .vedanta-glance-title { font-size: 20px; line-height: 27px; }
  .vedanta-glance-stat-val { font-size: 34px; line-height: 40px; }
  .vedanta-glance-overview-text { font-size: 15px; line-height: 24px; }

  /* Our value chain */
  .value-chain-heading { display: block; text-align: center; margin-bottom: 36px; }
  .value-chain-grid { gap: 30px; }
  .value-chain-card {
    flex: 0 0 100%;
    max-width: 100%;
  }
}


/* =========================================================
   ESG purpose / Operating structure — responsive
   ========================================================= */
@media (max-width: 991px) {
  /* ESG purpose */
  .esg-purpose-row {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .esg-purpose-aims {
    border-left: 0;
    padding-left: 0;
  }
}

@media (max-width: 767px) {
  .esg-purpose-aims { grid-template-columns: 1fr; gap: 18px; }
  .esg-purpose-theme { flex-direction: column; align-items: flex-start; gap: 16px; }
}

@media (max-width: 575px) {
  .esg-purpose-icon { width: 110px; height: 110px; }
  .esg-purpose-icon img { width: 64px; height: 64px; }
}


/* =========================================================
   Presence — India / Global maps responsive
   ========================================================= */
@media (max-width: 991px) {
  /* Map and legend stack */
  .presence-top { grid-template-columns: 1fr; gap: 30px; }
  .presence-map-wrap { max-width: 560px; margin: 0 auto; }
  /* Lists step to 3 across */
  .presence-list { grid-template-columns: repeat(3, 1fr); }
  /* Capability boxes to 2 across; pair each title with its own box */
  .presence-capability-grid { grid-template-columns: repeat(2, 1fr); }
  .presence-capability-text { min-height: 0; }
  .presence-capability-heads { display: none; }
  .presence-capability-grid { margin-top: 0; border-top: 1px solid #939598; padding-top: 18px; }
  .presence-capability-title-inline { display: block; }
}
@media (max-width: 767px) {
  .presence-legend { grid-template-columns: repeat(2, 1fr); }
  .presence-list { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
  .presence-region-title { font-size: 20px; line-height: 26px; }
  .presence-legend { grid-template-columns: 1fr; padding: 18px 20px; }
  .presence-list { grid-template-columns: 1fr; }
  /* Boxes to single column (title pairing already handled at <=991px) */
  .presence-capability-grid { grid-template-columns: 1fr; }
  .presence-capability-title { padding: 0 16px; }
}


/* =========================================================
   Asset Overview — business segments responsive
   ========================================================= */
@media (max-width: 991px) {
  .segment { padding: 44px 0; }
  /* Stack media below content, always content first.
     Drop the desktop equal-height min-height so stacked cards size to content. */
  .segment-row,
  .segment-reverse .segment-row {
    grid-template-columns: 1fr;
    gap: 30px;
    min-height: 0;
  }
  /* Stacked image: explicit height, and cancel the page-edge bleed so it
     stays within the container (no sideways overflow). */
  .segment-media,
  .segment-reverse .segment-media {
    --edge: 0px;
    min-height: 300px;
    height: 300px;
    order: 2;
    margin-left: 0;
    margin-right: 0;
    border-radius: 8px;
  }
  .segment-content { order: 1; }
  .segment-title { font-size: 24px; line-height: 30px; }
  /* Reveal slides up from below when stacked */
  .segment .segment-media,
  .segment-reverse .segment-media { transform: translateY(40px); }
  .segment.in-view .segment-media { transform: translateY(0); }
}
@media (max-width: 767px) {
  .segment-cols { grid-template-columns: 1fr; gap: 0; }
  .segment-stat-val { font-size: 30px; line-height: 34px; }
}
@media (max-width: 575px) {
  .segment-media { min-height: 240px; height: 240px; }
  .segment-stats { gap: 20px 30px; }
}


/* =========================================================
   Investment Case — timeline + asset base responsive
   ========================================================= */
@media (max-width: 991px) {
  .ic-value-heading { font-size: 20px; line-height: 28px; margin-bottom: 36px; }
  /* Timeline collapses to a single left-aligned column */
  .ic-timeline-line { left: 6px; }
  .ic-tl-item {
    width: 100%;
    margin: 0 !important;
    text-align: left !important;
    padding: 0 0 44px 30px;
  }
  .ic-tl-text { font-size: 17px; line-height: 24px; }
  .ic-tl-left .ic-tl-bar { margin-left: 0; }

  /* Asset base */
  .ic-asset-banner { font-size: 18px; line-height: 25px; padding: 18px 20px; }
  .ic-asset-metrics { grid-template-columns: repeat(3, 1fr); padding-left: 0; }
}
@media (max-width: 767px) {
  /* Keep asset metrics in 2 columns on mobile (except Oil & Gas, whose
     values are long text and need full width). */
  .ic-asset-metrics { grid-template-columns: repeat(2, 1fr) !important; }
  .ic-asset-metrics-oil { grid-template-columns: 1fr !important; }
  .ic-asset-duo { grid-template-columns: 1fr; gap: 34px; }
}
@media (max-width: 575px) {
  .ic-asset-metrics { grid-template-columns: repeat(2, 1fr) !important; }
  .ic-asset-metrics-oil { grid-template-columns: 1fr !important; }
  .ic-asset-metrics-2 { grid-template-columns: 1fr; }
  .ic-asset-head { flex-wrap: wrap; }
  .ic-asset-rule { display: none; }
}


/* =========================================================
   Investment Case — India growth + track record responsive
   ========================================================= */
@media (max-width: 991px) {
  .ic-india-top { grid-template-columns: 1fr; gap: 30px; }
  .investment-case-mini-graph-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .ic-reserves-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
  .investment-case-mini-graph-grid { grid-template-columns: 1fr; }
  .ic-reserves-grid { grid-template-columns: 1fr; }
  .ic-reserves { padding: 24px 20px; }
  .ic-india-growth-title { font-size: 18px; }
}


/* =========================================================
   Investment Case — capital allocation + ESG responsive
   ========================================================= */
@media (max-width: 991px) {
  .ic-capital-row { grid-template-columns: 1fr; gap: 30px; }
  .ic-esg-row { grid-template-columns: 1fr; gap: 0; }
  .ic-esg-col .ic-asset-points { margin-bottom: 18px; }
}
@media (max-width: 575px) {
  .ic-capital-header-pill { font-size: 16px; padding: 8px 18px; }
}


/* =========================================================
   Our Reporting Suite — performance hero + results responsive
   ========================================================= */
@media (max-width: 991px) {
  .reporting-performance-hero-title { font-size: 40px; line-height: 46px; }
  .reporting-results-grid { grid-template-columns: repeat(3, 1fr); }
  .reporting-result-val { font-size: 30px; line-height: 36px; }
}
@media (max-width: 767px) {
  .reporting-performance-hero-title { font-size: 30px; line-height: 36px; }
  .reporting-results-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
  .reporting-performance-hero-title { font-size: 24px; line-height: 30px; }
  .reporting-results-grid { grid-template-columns: 1fr; }
  .reporting-results-title { font-size: 20px; }
}

/* =========================================================
   GLOBAL RESPONSIVE PASS — banners, page heads, headings
   (About the Report, Reporting Suite, Vedanta at a Glance,
    Presence, Asset Overview, Investment Case, Chairman's
    Message, Director's Message, Management Speak, KPIs)
   ========================================================= */

/* On tablet/mobile, the wow.js scroll animation can fail to fire and
   leave elements stuck at visibility:hidden / opacity:0 — which hides
   charts, images and content. Force every .wow element visible so the
   page content always shows on smaller devices. */
@media (max-width: 991px) {
  .wow,
  .wow.animated {
    visibility: visible !important;
    opacity: 1 !important;
    animation-name: none !important;
    animation: none !important;
    transform: none !important;
  }

  /* KPI charts: SVGs have only a viewBox (no intrinsic size), so without
     an explicit width they collapse to 0 height and look "missing".
     Force full-width display. */
  .kpi-card-media,
  .kpi-card-chart { max-width: 100% !important; width: 100% !important; }
  .kpi-card-chart img {
    width: 100% !important;
    max-width: 250px !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Management-speak person photos: stop them collapsing to 30% width /
     100% height of an undefined parent. The shared flex:1 1 0 gives the
     media a 0 basis in the stacked column, collapsing its height — reset
     it to size to its own content. */
  .management-speak-media {
    flex: 0 0 auto !important;
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }
  .management-speak-media img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  /* Management-speak Q&A inline images */
  .management-qa-figure-right img {
    width: 100% !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* ---- Tablet / small laptop ---- */
@media (max-width: 991px) {
  /* Full-screen banners shorter on tablet */
  .it-heading { font-size: 40px; line-height: 46px; }
  .it-eyebrow { font-size: 15px; }

  /* Page-head (no-banner pages) */
  .ch-pagehead { padding-top: 90px; }
  .ch-heading { font-size: 34px; line-height: 40px; }

  /* Chairman / Director message */
  .chairman-message-salutation { font-size: 44px; }
  .chairman-message-stats { gap: 40px; }
  .chairman-message-stat-value { font-size: 36px; }

  /* Management speak person rows */
  .management-speak-row { gap: 30px; }

  /* KPI grids → 2 cols stays, but charts get more room */
  .kpi-page-title { font-size: 26px; line-height: 32px; }
  .kpi-card-media { flex: 0 0 46%; max-width: 46%; }
  .kpi-grid-3 { column-gap: 28px; }
}

/* ---- Large phone / portrait tablet ---- */
@media (max-width: 767px) {
  .it-content{
    padding: 30px 0px;
  }
  .it-intro{
    margin-bottom: 30px;
  }
  .ch-cap{
    padding-top: 0px;
  }
  .ch-outcomes-head{
    margin-top: 30px;
  }
  .ch-cap:not(:last-of-type) > .container{
    padding-bottom: 30px;
  }
  .ch-cap:not(:last-of-type) > .container{
    border-bottom: none;
  }
  .vedanta-glance-overview{
    padding: 30px  0px;
  }
  .vedanta-glance-leading{
    padding: 0 0 30px;
  } 
  .value-chain-section{
    padding: 30px 0px;
  }
  .esg-purpose-row{
    padding-bottom: 30px;
  }
  .esg-purpose-section { padding: 30px 0 0; }
  .operating-structure-section{
    padding: 0px 0px 30px;
  }
  .presence-section{
    padding: 0 0 30px;
  }
  .presence-capability-section{
    padding: 0 0 30px;
  }
  
  .segment { 
    padding: 30px 0;
    margin-top: 0;
  }
  .investment-case-intro-section{
    padding: 30px 0px;
  }
  
  .ic-value { padding: 30px 0;
  margin-bottom: 30px; }
  .ic-value-heading{
    margin-bottom: 30px;
  }
  .ic-asset{
    padding: 0px 0px 0px;
  }
  .ic-chart{
    padding: 0;
    max-width: 100%;
  }
  .ic-chart-source{
    margin-bottom: 30px;
  }
  .ic-track-intro{
    margin-bottom: 30px;
  }
  .ic-track-note{
    margin-bottom: 0px;
  }
  .ic-reserves{
    margin-bottom: 30px;
  }
  .ic-capital-diagram,.ic-asset-points,.ic-esg-row,.ic-asset-intro{
    margin-bottom: 30px;
  }
  .chairman-message-salutation{
    margin: 30px 0 18px;
  }
  .chairman-message-subhead,.chairman-message-split,.chairman-message-sign{
    margin-top: 30px;
  }
  .chairman-message-letter{
    padding-bottom: 30px;
  }
  .management-speak{
    padding: 0 0 30px;
  }
  .management-speak-row{
    margin-bottom: 30px;
  }
  .management-qa-item{
    margin-bottom: 12px;
  }
  .management-qa-subhead{
    margin-top: 15px;
  }
  .management-qa{
    padding-bottom: 30px;
  }
  .cs-hero{
    padding-bottom: 30px;
  }
  .cs-section{
    padding-bottom: 10px;
  }
  .cssecmrgnbotm20{
    margin-bottom: 20px;
  }
  .kpi-page-title{
    margin-bottom: 20px;
  }
  .kpi-group-title{
    margin: 0 0 20px;
  }
  .kpi-footnote{
    margin: 0 0 10px;
  }
  .kpi-subgroup-title{
    margin-top: 0;
  }
  .vca-section{
    padding: 40px 0 10px;
  }
  .vca-row{
    row-gap: 20px;
  }
  .vc-acc .accordion-button{
    padding-top: 0;
  }
  .bseg-section{
    padding: 20px 0 10px;
  }
  .six-cap-section{
    padding-top: 0px;
  }
  .opp-trend{
    padding-bottom: 30px;
  }
  .opp-response-inner{
    padding: 20px 25px;
  }
  .spd-section{
    margin-top: 0;
    padding-bottom: 30px;
  }
  .esg-pillar{
    padding: 0;
  }
  .spd-cols{
    gap: 25px;
  }
  .sp-grid{
    gap: 30px;
  }
  .rm-frameworks, .rm-erm, .rm-process{
    padding-bottom: 30px;
  }
  .rm-erm-text{
    margin-bottom: 25px;
  }
  .rm-risks{
    padding-bottom: 30px;
  }
  .bod-section,.bod-legend-section,.bod-charts{
    padding: 0 0 30px;
  }
  .mc-section{
    padding: 0 0 30px;
  }
  .stakeholder-framework.stakeholder-groups .stakeholder-framework-box{
    padding: 20px;
  }

  .dma-section{
    padding-bottom: 30px;
  }
  .dma-strategy{
    margin-top: 30px;
  }
  .dma-matrix{
    padding-bottom: 30px;
  }
  .mi-card{
    margin-bottom: 20px;
  }
  .mi-bc{
    margin-bottom: 0;
  }
  .mi-section{
    padding-bottom: 0;
  }
  .riskmangetopsection p:last-child, .dmstopsec p:last-child{
    margin-bottom: 30px;
  }
  .esg-overview{
    margin-bottom: 10px;
  }
  .esg-sdg{
    margin-bottom: 10px;
  }
  .esg-pillar{
    padding: 10px 0 0 ;
  }
  .es-section{
    padding: 30px 0px 0;
  }
  .es-text{
    margin-top: 0;
  }
  .es-subhead{
    margin-top: 15px;
  }
  .tc-block-head{
    margin-top: 5px;
  }
  .es-section.es-section--alt{
    padding-top: 0;
  }
  .es-section-subtitle{
    margin-bottom: 20px;
  }
  .es-board-img{
    margin-bottom: 30px;
  }
  .es-sc-group{
    margin-top: 20px;
  }
  .tc-intro-grid{
    margin-bottom: 30px;
  }
  .tc-tag{
    margin-bottom: 10px;
  }
  .tc-focus{
    margin-bottom: 30px;
  }
  .transformingCommunitiesPage .tc-intro-grid {
    gap: 18px;
    margin-bottom: 26px;
  }
  .transformingCommunitiesPage .tc-callout {
    padding: 0;
  }
  .transformingCommunitiesPage .tc-focus {
    grid-template-columns: 1fr;
    margin-bottom: 30px;
  }
  .transformingCommunitiesPage .tc-focus-item {
    padding: 14px 0;
    border-right: 0;
    font-size: 15px;
    line-height: 22px;
  }
  .transformingCommunitiesPage .tc-stats,
  .transformingCommunitiesPage .tc-stats--4,
  .transformingCommunitiesPage .tc-aim-grid,
  .transformingCommunitiesPage .tc-split,
  .transformingCommunitiesPage .tc-strategy-cols,
  .transformingCommunitiesPage .tc-oversight,
  .transformingCommunitiesPage .tc-case-grid {
    grid-template-columns: 1fr;
  }
  .transformingCommunitiesPage .tc-stats,
  .transformingCommunitiesPage .tc-stats--4 {
    gap: 0;
  }
  .transformingCommunitiesPage .tc-stat,
  .transformingCommunitiesPage .tc-stats--4 .tc-stat {
    padding: 10px 0;
    border-right: 0;
  }
  .tc-aim{
    margin-left: 0;
  }
  .tc-aim{
    margin-bottom: 25px;
  }
  .transformingCommunitiesPage .tc-stat:nth-child(2n+1),
  .transformingCommunitiesPage .tc-stat:nth-child(3n+1) {
    padding-left: 0;
  }
  .transformingCommunitiesPage .tc-stat-num {
    font-size: 26px;
    line-height: 32px;
  }
  .transformingCommunitiesPage .tc-stat-num span {
    font-size: 15px;
  }
  .transformingCommunitiesPage .tc-stat-num--sm {
    font-size: 17px;
    line-height: 24px;
  }
  .transformingCommunitiesPage .tc-stat-label,
  .transformingCommunitiesPage .tc-split-text p,
  .transformingCommunitiesPage .tc-aim-col p,
  .transformingCommunitiesPage .tc-bu-list li,
  .transformingCommunitiesPage .tc-case-body p {
    font-size: 15px;
    line-height: 22px;
  }
  .transformingCommunitiesPage .tc-aim {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .transformingCommunitiesPage .tc-aim::after {
    position: static;
    display: block;
    order: -1;
    width: 80px;
    height: 6px;
    margin: 0 0 12px;
    z-index: 0;
  }
  .transformingCommunitiesPage .tc-aim-no {
    font-size: 34px;
  }
  .transformingCommunitiesPage .tc-aim-title {
    padding-left: 0;
    border-left: 0;
    font-size: 22px;
    line-height: 28px;
  }
  .transformingCommunitiesPage .tc-aim-grid {
    gap: 8px;
    margin-bottom: 30px;
  }
  .transformingCommunitiesPage .tc-aim-col {
    margin-top: 16px;
  }
  .transformingCommunitiesPage .tc-split {
    gap: 22px;
  }
  .transformingCommunitiesPage .tc-split-img {
    order: -1;
  }
  /* Nand Ghar: on mobile the image goes below the two paragraphs, not above the heading */
  .transformingCommunitiesPage .tc-split--nandghar .tc-split-img {
    order: 1;
    padding-bottom: 24px;
  }
  .transformingCommunitiesPage .tc-sdg {
    gap: 14px 18px;
  }
  .transformingCommunitiesPage .tc-sdg-item {
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    line-height: 18px;
  }
  .transformingCommunitiesPage .tc-sdg-item img {
    width: 48px;
    height: 48px;
  }
  .transformingCommunitiesPage .tc-strategy {
    margin: 28px 0 10px;
    padding-top: 16px;
  }
  .transformingCommunitiesPage .tc-strategy-head {
    margin-bottom: 22px;
  }
  .transformingCommunitiesPage .tc-strategy-cols {
    gap: 18px;
    margin-bottom: 24px;
  }
  .transformingCommunitiesPage .tc-oversight {
    gap: 0;
    padding: 6px 16px 16px;
  }
  .transformingCommunitiesPage .tc-ov-item {
    padding: 10px 0;
  }
  .transformingCommunitiesPage .tc-case-title {
    font-size: 22px;
    line-height: 28px;
  }
  .transformingCommunitiesPage .tc-case-meta {
    gap: 12px 20px;
    margin-bottom: 20px;
  }
  .transformingCommunitiesPage .tc-case-grid {
    gap: 22px;
  }
  .transformingCommunitiesPage .tc-case-side .es-diagram-img {
    margin-bottom: 18px;
  }
  .transformingCommunitiesPage .tc-case-outcome {
    padding: 18px;
  }
  .transformingCommunitiesPage .tc-bu-list {
    margin: 4px 0 0;
  }
  .transformingCommunitiesPage .tc-bu-list li {
    margin-bottom: 14px;
  }
  .transformingCommunitiesPage .es-diagram-img--full img,
  .transformingCommunitiesPage .es-diagram-img1 img,
  .transformingCommunitiesPage .tc-split-img img,
  .transformingCommunitiesPage .tc-case-side img {
    width: 100%;
    height: auto;
  }
  .tc-levers{
    margin-bottom: 30px;
  }
  .tc-aim-grid{
    margin-bottom: 10px;
  }
  .tc-navcards{
    margin-bottom: 30px !important;
  }
  .tc-aim{
    padding: 10px;
  }
  .tc-stat{
    padding: 10px 0px;
  }
  .pc-content{
   padding: 30px 0px;
  }
  .pc-feature-copy{
    padding: 0 0 30px;
  }
  .pc-feature-section{
    padding-bottom: 30px;
  }
  .mr-section{
    padding: 30px 0px;
  }
  .alumininum-segement{
    padding: 30px 0px;
  }
  .sr-segment-block,.sr-sector--facor,.sr-sector--oil,.sr-sector--power,.sr-sector--zinc,.sr-sector--lead,.sr-sector--silver,.sr-sector--iron{
    padding-bottom: 30px;
  }
  .fr-topsection{
    padding: 30px 0px 0;
  }
  .es-text{
    margin-bottom: 20px;
  }
  
  .it-banner{
    justify-content: flex-start;
  }
  .desktopbannerImg{
    display: none;
  }
  .mobbannerImg{
    display: block;
  }
  /* Hero banner video: use the mobile video on small screens */
  .topBanner .desktopV{
    display: none;
  }
  .topBanner .mblV{
    display: block;
  }
  .sp-content{
    top: 20%;
  }
  
.slider-nav .item1 {
  background-image: url(../images/mobile/homepage/zinc-lead-silver-img.png);
}
.slider-nav .item2 {
  background-image: url(../images/mobile/homepage/aluminium-img-mob.png);
}
.slider-nav .item3 {
  background-image: url("../images/mobile/homepage/oil-&-gas-img-mob.png");
}
.slider-nav .item4 {
  background-image: url(../images/mobile/homepage/power-img-mob.png);
}
.slider-nav .item5 {
  background-image: url(../images/mobile/homepage/Iron-ore-img-mob.png);
}
.slider-nav .item6 {
  background-image: url(../images/mobile/homepage/steel-img-mob.png);
}
.slider-nav .item7 {
  background-image: url(../images/mobile/homepage/facor-img-mob.png);
}
.slider-nav .item8 {
  background-image: url(../images/mobile/homepage/copper-img-mob.png);
}
  .es-diagram-img1{
    margin-bottom: 20px;
  }
  .it-banner.msg-banner{
    justify-content: flex-end;
  }
  .stakeholder-framework-title{
    font-size: 26px;
    line-height: 30px;
  }
  .zi-projects-box{
    margin: 10px 0 30px;
  }
  .it-heading { font-size: 30px; line-height: 36px; }
  .it-heading span { font-size: 32px; line-height: 38px; }
  .ch-heading { font-size: 28px; line-height: 34px; }

  /* Chairman / Director: stack splits, equal-height off */
  .chairman-message-split { flex-direction: column; gap: 24px; }
  .chairman-message-split-media img { height: auto; }
  .chairman-message-salutation { font-size: 40px; }
  .chairman-message-stats { gap: 28px; }

  /* Management speak: stack person blocks + Q&A figure */
  .management-speak-row { flex-direction: column; gap: 30px; }
  .management-speak-media-left { order: 2; }
  .management-speak-media {
    max-width: 100%;
    width: 100%;
  }
  .management-speak-media img { height: auto; }
  /* Ensure slide-in images are always visible on mobile even if
     the wow.js scroll animation does not fire on small screens */
  .management-speak-media.wow { visibility: visible !important; opacity: 1 !important; animation: none !important; transform: none !important; }
  .management-qa-figure-right { float: none; width: 100%; max-width: none; margin: 18px 0; }
  .management-qa-question { font-size: 16px; line-height: 22px; }

  /* KPI: single column + chart on top */
  .kpi-grid { grid-template-columns: 1fr; row-gap: 10px; }
  .kpi-grid-3 { grid-template-columns: 1fr; row-gap: 10px; }
  .kpi-card-body { flex-direction: column; gap: 20px; }
  .kpi-card-media { flex-basis: auto; max-width: 60%; }
  .kpi-card-stacked .kpi-card-chart { max-width: 60%; }

  /* Investment case ESG + asset metrics */
  .ic-asset-metrics { grid-template-columns: repeat(2, 1fr); padding-left: 0; }
}

/* ---- Phone ---- */
@media (max-width: 575px) {
  .it-heading { font-size: 26px; line-height: 32px; }
  .it-heading span { font-size: 28px; line-height: 34px; }
  .ch-heading { font-size: 24px; line-height: 30px; }
  .ch-pagehead { padding-top: 80px; }

  .chairman-message-salutation { font-size: 34px; }
  .chairman-message-stats { flex-direction: column; gap: 20px; }
  .chairman-message-stat-value { font-size: 32px; }

  .management-qa-question { font-size: 15px; }

  .kpi-page-title { font-size: 22px; line-height: 28px; }
  .kpi-group-title { font-size: 18px; line-height: 24px; }
  .kpi-card-media { max-width: 75%; }
  .kpi-card-stacked .kpi-card-chart { max-width: 75%; }

  .ic-asset-metrics { grid-template-columns: repeat(2, 1fr) !important; }
  .ic-asset-metrics-oil { grid-template-columns: 1fr !important; }
}

/* ---- Small phone ---- */
@media (max-width: 380px) {
  .it-heading { font-size: 22px; line-height: 28px; }
  .ch-heading { font-size: 21px; line-height: 27px; }
  .chairman-message-salutation { font-size: 30px; }
}
@media (max-width: 767px){
  .tc-aim::after {
    position: static;
    display: block;
    order: -1;
    width: 80px;
    height: 6px;
    margin: 0 0 12px;
    z-index: 0;
  }
  .pc-nextgen-block.pl20{
    padding-left: 0;
  }
  .pc-capability-text{
    padding-top: 0px;
  }
  .pc-awards-section{
    padding-bottom: 24px;
  }
  .cg-intro-section{
    padding: 30px 0px;
  }
  .cg-framework-section{
    padding: 25px 0 30px;
  }
  .cg-pie-figure{
    margin-bottom: 15px;
  }
  .cg-pie-section{
    padding-bottom: 0;
  }
  .cg-board-governance-section{
    padding-bottom: 10px;
  }
  .cg-esg-section{
    padding-bottom: 0px;
  }
  .cg-ratings-section{
    padding: 0 0 0px;
  }
  .cg-rating-card{
    margin-bottom: 20px;
  }
  .cg-ratings-grid{
    border-left: none;
  }
  .pc-block--blue, .pc-block--white, .pc-block--stat {
    padding-bottom: 20px;
}
    .peopleCulturePage .pc-stat {
        font-size: 30px;
    }
          .cg-framework-label {
        font-size: 16px;
        line-height: 22px;
        min-height: 80px;
    }
  .cg-pie-figure.second img{
    max-width: 300px;
  }
  .cg-pie-figure.second {
    max-width: 300px;
  }
  .tc-levers, .tc-case-outcome
  {
    padding: 20px;
  }
  .tc-stats--4 {
    gap: 20px 30px;
}
.tc-aim-col
{
  margin-top: 20px;
}
.tc-focus.tc-focus--4 .tc-focus-item
{
  padding-left: 0px;
}
}

/* =====================================================================
   START CSS: Value Creation Model cards (value-creation-modal)
   ===================================================================== */
@media (max-width: 991px) {
  .vca-num { font-size: 34px; top: 16px; transform: translateX(-68px); }
  .vca-item { padding: 30px 18px 26px; }
  .vca-icon img { width: 50px; height: 50px; }
  .vca-text { font-size: 15px; line-height: 20px; }
}
@media (max-width: 575px) {
  .vca-item { padding: 26px 14px 22px; gap: 12px; }
  .vca-icon img { width: 46px; height: 46px; }
  .vca-num { font-size: 30px; top: 14px; transform: translateX(-56px); }
  .vca-text { font-size: 14px; line-height: 19px; }
}

/* Resources and Relationships Deployed grid */
@media (max-width: 991px) {
  .vcr-grid { grid-template-columns: 1fr; column-gap: 0; row-gap: 24px; }
  /* single column: only the very first item has no top rule */
  .vcr-item:nth-child(2) { border-top: 1px solid #e3e6ea; padding-top: 24px; }
  .vcr-item:nth-child(1) { border-top: none; padding-top: 0; }
}
@media (max-width: 480px) {
  .vcr-item { gap: 16px; }
  .vcr-head { flex: 0 0 100px; max-width: 100px; }
  .vcr-icon img { width: 46px; height: 46px; }
}

/* Business Segments */
@media (max-width: 991px) {
  /* 2 per row: vertical divider on the right column, horizontal above rows 2+ */
  .bseg-item { flex: 0 0 50%; max-width: 50%; padding: 20px; }
  .bseg-item:nth-child(even)::before { display: block; }
  .bseg-item:nth-child(n+3)::after { display: block; }
}
@media (max-width: 480px) {
  /* single column, centered content, only horizontal dividers */
  .bseg-item:nth-child(even)::before { display: none; }
  .bseg-item:nth-child(n+2)::after { display: block; }
}
@media (max-width: 767px) {
  .bseg-item { flex: 0 0 100%; max-width: 100%; justify-content: start; padding: 18px; }
}

/* Utilising the six capitals */
@media (max-width: 991px) {
  .six-cap-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
  .six-cap-grid { grid-template-columns: 1fr; }
}

/* Stakeholders legend */
@media (max-width: 991px) {
  .stk-legend { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 575px) {
  .stk-legend { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 380px) {
  .stk-legend { grid-template-columns: 1fr; }
}

/* Purpose-Driven Mining trend (opportunities) */
@media (max-width: 575px) {
  .opp-trend-code { font-size: 34px; }
}

/* Strategic Priorities cards */
@media (max-width: 767px) {
  /* 2 per row */
  .sp-card { flex: 0 0 calc(50% - 13px); max-width: calc(50% - 13px); }
}
@media (max-width: 480px) {
  /* 1 per row */
  .sp-card { flex: 0 0 100%; max-width: 100%; }
}

/* Strategic Priority detail S1 */
@media (max-width: 767px) {
  /* drop the overlap so wrapped titles don't collide with the banner */
  .spd-head {
    position: static;
    width: 100%;
    padding: 16px 5px;
  }
  .spd-banner { padding: 16px 20px; }
  .spd-list { column-count: 2; column-gap: 30px; }
}
@media (max-width: 480px) {
  .spd-list { column-count: 1; }
}
@media (max-width: 767px) {
  .esg-pillars-grid { grid-template-columns: 1fr; gap: 0; }
  .gb-list { column-count: 2; column-gap: 30px; }
  .spd-impact { gap: 24px 36px; }
}
@media (max-width: 480px) {
  .gb-list { column-count: 1; }
}
@media (max-width: 991px) {
  .gb-list.gb-3col { max-width: 100%; }
}
@media (max-width: 991px) {
  .spd-cols { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
  .spd-cols { grid-template-columns: 1fr; }
}
/* =====================================================================
   END CSS: Value Creation Model cards (value-creation-modal)
   ===================================================================== */

/* =====================================================================
   START CSS: Risk Management page (risk-management)
   ===================================================================== */
@media (max-width: 767px) {
  .rm-frameworks .col-md-6 + .col-md-6 { margin-top: 40px; }
  .risk-detail .col-md-6 + .col-md-6 { margin-top: 22px; }
  .rm-erm-title { font-size: 18px; }
  .rm-heat-title { font-size: 16px; }
  .risk-card--no-tag,
  .risk-card:not(.risk-card--no-tag) { margin-top: 0; }
  .risk-card--no-tag .risk-card-head,
  .risk-card:not(.risk-card--no-tag) .risk-card-head {
    position: static;
    top: auto;
    right: auto;
    width: 100%;
    height: auto;
    min-height: 60px;
    padding: 14px 16px;
    flex-wrap: wrap;
    box-shadow: 0px 10px 12px 2px rgba(0, 0, 0, 0.08);
  }
  .risk-card:not(.risk-card--no-tag) { padding-top: 28px; }
  .risk-card:not(.risk-card--no-tag) .risk-tag {
    top: 0;
    left: 0;
    font-size: 14px;
    line-height: 18px;
    padding: 8px 10px;
  }
  .risk-card--no-tag .risk-card-head,
  .risk-card:not(.risk-card--no-tag) .risk-card-head { padding-left: 0; }
  .risk-card--no-tag .risk-code,
  .risk-card:not(.risk-card--no-tag) .risk-code {
    padding: 0 12px 0 16px;
    font-size: 32px;
  }
  .risk-card--no-tag .risk-name,
  .risk-card:not(.risk-card--no-tag) .risk-name {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 12px;
    font-size: 16px;
    line-height: 20px;
  }
  .risk-card--no-tag .risk-trend,
  .risk-card:not(.risk-card--no-tag) .risk-trend {
    margin-left: auto;
    padding: 0 16px 0 10px;
  }
  .risk-card--no-tag .risk-card-foot,
  .risk-card:not(.risk-card--no-tag) .risk-card-foot { padding: 16px 16px 14px; }
}
/* =====================================================================
   END CSS: Risk Management page (risk-management)
   ===================================================================== */

/* =====================================================================
   START CSS: Board of Directors (board-of-directors)
   ===================================================================== */
@media (max-width: 767px) {
  .bod-modal .modal-dialog {
    margin: 0.75rem;
  }
  .bod-modal .modal-body { padding: 22px 18px; }
  .bod-modal-top {
    flex-direction: column;
    gap: 16px;
    margin-bottom: 16px;
  }
  .bod-modal-left {
    flex: 0 0 auto;
    max-width: 100%;
    width: 100%;
  }
  .bod-modal-photo {
    max-width: 250px;
  }
  .bod-modal-right,
  .bod-modal-rest {
    text-align: left;
  }
  .bod-modal-name {
    font-size: 17px;
    line-height: 22px;
    padding-right: 28px;
  }
 
  .bod-role { min-height: 0; }
  .bod-legend-key { flex-wrap: wrap; gap: 12px 20px; }
  .bod-legend-expertise {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 14px;
  }
  .bod-legend-expertise .bod-legend-exp:nth-child(9) { grid-column: auto; }
  .bod-legend-exp span {
    max-width: 120px;
    margin: 0 auto;
  }
}
/* =====================================================================
   END CSS: Board of Directors (board-of-directors)
   ===================================================================== */

/* =====================================================================
   START CSS: Board legend standalone (board-of-directors)
   ===================================================================== */
@media (max-width: 991px) {
  .bod-legend-standalone {
    display: block;
  }
  .bod-legend-standalone .bod-legend-committees,
  .bod-legend-standalone .bod-legend-expertise {
    width: 100%;
    max-width: 100%;
  }
  .bod-legend-standalone .bod-legend-expertise {
    margin-top: 18px;
    padding-left: 0;
    padding-top: 18px;
    border-left: none;
    border-top: 1px solid #d8dee7;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 767px) {
  .bod-legend-standalone .bod-legend-expertise {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* =====================================================================
   END CSS: Board legend standalone (board-of-directors)
   ===================================================================== */

/* =====================================================================
   START CSS: Addressing our material issues (double-materiality-assessment)
   ===================================================================== */
@media (max-width: 767px) {
  .mi-card-head { position: static; top: auto; left: auto; right: auto; min-height: 0; flex-wrap: wrap; gap: 6px; }
  .mi-card { margin-top: 0; }
  .mi-card-bar { padding: 14px 18px; }
  .mi-band-r { grid-template-columns: 1fr; }
  .mi-band{
    margin-bottom: 20px;
  }
  .sp-section { padding: 10px 0 30px; }
  .mi-bc--2 { grid-column: span 1; }
  .mi-bc { padding: 8px 0; }
  .mi-bc + .mi-bc { border-left: none; padding-left: 0; }
}
/* =====================================================================
   END CSS: Addressing our material issues (double-materiality-assessment)
   ===================================================================== */

/* hide material-issues column dividers when columns stack */
@media (max-width: 767px) {
  .mi-cols > [class*="col-"]::before { display: none; }
}

/* =====================================================================
   START CSS: Finance Review (finance-review)
   ===================================================================== */
@media (max-width: 767px) {
  .fr-visual-card {
    margin-top: 20px;
    margin-bottom: 0;
  }
  .fr-analysis-section{
    margin-top: 30px;
  }
  .fr-analysis-block{
    margin-bottom: 30px;
  }
  .fr-bridge-head {
    display: block;
    margin-bottom: 10px;
  }
  .fr-data-table th,
  .fr-data-table td {
    padding: 7px 8px;
    font-size: 12px;
    line-height: 16px;
  }
  .fr-subrow {
    padding-left: 16px !important;
  }
  .fr-data-table--bridge td:last-child {
    width: 76px;
  }
  .fr-detail-block {
    margin-top: 24px;
  }
    .fr-list {
    padding-left: 20px;
  }
  .zi-projects-box
  {
    padding: 20px;
  }
  .zi-banner-title h1 {
    font-size: 26px;
    line-height: 32px;
}
.zi-brief
{
  padding: 20px;
}
}
/* =====================================================================
   END CSS: Finance Review (finance-review)
   ===================================================================== */

@media (max-width: 991px) {
  /* on mobile the split stacks; let the table scroll instead of overflowing the page */
  .es-table-wrap--noscroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}