@media (min-width: 1920px) and (max-width: 2560px) {
}

@media (min-width: 1600px) and (max-width: 1919px) {

}

/* 
@media  screen and (max-width: 1440px) {

.common-ttle{ font-size: 46px;}
.common-desc{ font-size: 20px;}
.common-cta{ font-size: 15px;}
#value-creation .creationRight {padding: 40px;}


}
*/
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
max-width: 1300px;
}
.fixed-nav-btn {width: 52px;}
.prev-btn .nav-icon {
left: 7px;
}
.next-btn .nav-icon {
right: 7px;
}
#rilOffcanvas.offcanvas {width: 600px !important;}
.oc-link {padding: 18px 20px;font-size: 18px;}




}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.oc-link {padding: 15px 20px;font-size: 16px;}
#rilOffcanvas.offcanvas {width: 500px !important;}


}


/* 3. scale and layout setting at 150% */
@media (resolution: 1.5dppx) {

}



/* 4. scale and layout setting at 175% */
@media (resolution: 1.75dppx) {
p {
font-size: 14px;
line-height: 22px;
}


}

/* Medium */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
.row {
margin-left: 0px;
margin-right: 0px;
}

/* .innerTitle { font-size: 32px; margin-bottom: 0px; } */
.environment-content,#ESGPerformanceHighlights .social-section .social-content, #ESGPerformanceHighlights .Governance-section .social-content { margin-top: 20px; }
#ESGPerformanceHighlights .social-section .social-image, #ESGPerformanceHighlights .Governance-section .social-image { margin-top: 0px; }
/* .ril-logo img {
    width: 57px;
} */
/* .ril-adni-logo img {height: 38px;} */
.ril-navbar {padding: 10px 10px;}
.custom-breadcrumb {margin-top: 63px;}
/* #ESGPerformanceHighlights .social-section .social-item h3, #ESGPerformanceHighlights .Governance-section .social-item h3 {font-size: 28px;} */
#ESGPerformanceHighlights .environment-section {padding: 30px 0 40px;}

}

/* Small */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait)   {
.row {
margin-left: 0px;
margin-right: 0px;
}
.fixed-page-navigation {bottom: 40px;}

.environment-content,#ESGPerformanceHighlights .social-section .social-content, #ESGPerformanceHighlights .Governance-section .social-content { margin-top: 20px; }
#ESGPerformanceHighlights .social-section .social-image, #ESGPerformanceHighlights .Governance-section .social-image { margin-top: 0px; }
.ril-logo img {
    width: 57px;
}
.ril-adni-logo img {height: 38px;}
.ril-navbar {padding: 10px 10px;}
.custom-breadcrumb {margin-top: 63px;}
#ESGPerformanceHighlights .social-section .social-item h3, #ESGPerformanceHighlights .Governance-section .social-item h3 {font-size: 28px;}
#ESGPerformanceHighlights .environment-section {padding: 30px 0 40px;}
}

/* Extra small */
@media (min-width: 320px) and (max-width: 767px) {
.row {
margin-left: 0px;
margin-right: 0px;
}
.oc-link {font-size: 18px;}
#rilOffcanvas.offcanvas {
width: 97vw !important;
}
.fixed-page-navigation { position: relative; display: block; margin-top: 20px; border-top:solid 1px #e4e4e4 ; padding-top: 30px; border-bottom:solid 1px #e4e4e4 ; padding-bottom: 30px; }
.fixed-page-navigation .prev-btn svg {width: 32px;padding-right: 10px;}
.fixed-page-navigation .next-btn svg {width: 32px;padding-left: 10px;}

.innerTitle { font-size: 32px; margin-bottom: 0px; }
.environment-content,#ESGPerformanceHighlights .social-section .social-content, #ESGPerformanceHighlights .Governance-section .social-content { margin-top: 20px; }
#ESGPerformanceHighlights .social-section .social-image, #ESGPerformanceHighlights .Governance-section .social-image { margin-top: 0px; }
.ril-logo img {
    width: 40px;
}
.ril-adni-logo img {height: 42px; padding-left: 14px;}
.ril-navbar {padding: 10px 10px;}
.custom-breadcrumb {margin-top: 63px;}
#ESGPerformanceHighlights .social-section .social-item h3, #ESGPerformanceHighlights .Governance-section .social-item h3 {font-size: 28px;}
#ESGPerformanceHighlights .environment-section {padding: 30px 0 40px;}

#Accglance .glance-hero {display: block;}
#Accglance .glance-hero__bg { position: relative; }
#Accglance .glance-hero::before { display: none; }
#Accglance .glance-hero__card { transform: translate(0px, 0px); }
#Accglance .glance-hero {
    min-height: auto;
    padding-bottom: 0px;
}
#Accglance .glance-hero { margin-bottom: 0px; }
#Accglance .glance-hero__text {
    margin-top: 10px;
}

#Accglance .pi-map {
    flex: 0 0 100%;
    max-width: 100%;
}

}

/* ============================================================
   HOME PAGE – RESPONSIVE ADDITIONS
   ============================================================ */

/* ── 1399px and below: tabnav becomes scrollable ── */
@media only screen and (max-width: 1399px) {
  .tabnav {
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    height: auto;
    min-height: 50px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .tabnav::-webkit-scrollbar { display: none; }
  .tabnav__item {
    flex: 0 0 auto;
    min-width: 110px;
    padding: 8px 10px;
    font-size: 11px;
    height: auto;
    min-height: 50px;
  }
}

/* ── 1199px and below: reflow absolute-positioned sections ── */
@media only screen and (max-width: 1199px) {

  
}

/* ── 991px and below ── */
@media only screen and (max-width: 991px) {

}

/* ── 767px and below ── */
@media only screen and (max-width: 767px) {


  /* INTRO */
  .intro { padding-top: 80px; }
  .intro__statement { padding-left: 30px; padding-right: 30px; }
  .intro__statement h2 { font-size: 30px; }
  .intro__para { padding-left: 30px; padding-right: 30px; font-size: 16px; }
  .intro__grid { padding: 30px 30px 80px; }

  /* RISE: single column grid */
  .rise__inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "title"
      "quote"
      "dots"
      "img"
      "text";
    padding: 40px 30px 0;
  }
  .rise__title { font-size: 34px; }
  .rise__mukesh {
    width: 55%; max-width: 220px;
    justify-self: flex-end;
    margin-top: -30px;
  }

  /* PERF */
  .perf__grid { width: 100%; max-width: 92%; grid-template-columns: 1fr 1fr; }
  .metric:not(:nth-child(3n)) { border-right: none; }
  .metric:nth-child(odd) { border-right: 1px solid rgba(0,0,0,.2); }
  .metric:nth-last-child(-n+3) { border-bottom: 1px solid rgba(0,0,0,.2); }
  .metric:nth-last-child(-n+2) { border-bottom: 0; }
  .perf__hl { width: 92%; gap: 0 50px; }

  /* DIVERSIFIED */
  .diversified__intro { padding-left: 30px; padding-right: 30px; }


  /* HERO QUOTE */
  .hero__quote { padding: 50px 20px 60px; gap: 30px; }
  .hero__portrait { width: 160px; height: 160px; }
  .hero__words { font-size: 18px; }
  .hero__who strong { font-size: 17px; }
  .hero__who span { font-size: 15px; }

  /* INTRO */
  .intro { padding-top: 50px; }
  .intro__statement { padding-left: 20px; padding-right: 20px; }
  .intro__statement h2 { font-size: 24px; }
  .intro__para { padding-left: 20px; padding-right: 20px; font-size: 15px; margin-top: 24px; }
  .intro__grid { padding: 24px 20px 50px; }

  /* RISE: flex column */
  .rise { height: auto; overflow: visible; padding-bottom:0px; }
  .rise__inner {
    display: flex;
    flex-direction: column;
    grid-template-columns: unset;
    grid-template-areas: unset;
    padding: 30px 20px 0;
    height: auto;
  }
  .rise__title {
    position: relative; left: auto; top: auto;
    font-size: 28px; margin-bottom: 16px;
    grid-area: unset;
    order: 1;
  }
  .rise__quotecard,
  .rise .rise__quotecard {
    position: relative; left: auto; top: auto;
    width: 100%; max-width: 100%;
    grid-area: unset;
    order: 2;
  }
  .rise__dots { grid-area: unset; order: 3; }
  .rise__mukesh {
    position: relative; left: auto; top: auto;
    width: 55%; max-width: 200px;
    height: auto;
    align-self: flex-end;
    margin-top: -20px;
    grid-area: unset;
    order: 5;
  }
  .rise__text {
    position: relative; left: auto; top: auto;
    width: 100%; margin-top: 20px;
    grid-area: unset;
    order: 4;
  }
  .rise .rise__qc { height: 140px; font-size: 14px; padding: 16px; }
  .rise__lead { font-size: 17px; }
  .rise__body { font-size: 15px; }

  /* DIVERSIFIED */
  .diversified__title { padding-left: 20px; padding-right: 20px; font-size: 26px; }
  .diversified__intro { padding-left: 20px; padding-right: 20px; }
  .diversified__intro p { font-size: 16px; }

  /* PERF */
  .perf { padding: 40px 0; }
  .perf__title { font-size: 30px; margin-bottom: 30px; }
  .perf__grid {
    width: 100%; max-width: 100%;
    padding: 0 15px;
    grid-template-columns: 1fr;
  }
  .metric { padding-bottom: 60px; }
  .metric:not(:nth-child(3n)),
  .metric:nth-child(odd) { border-right: none; }
  .metric__big { font-size: 30px; }
  .metric:nth-last-child(-n+3),
  .metric:nth-last-child(-n+2) { border-bottom: 1px solid rgba(0,0,0,.2); }
  .metric:last-child { border-bottom: 0; }
  .echart-donut { width: 160px !important; height: 160px !important; }
  .metric--donut .donutwrap { flex-direction: column; align-items: flex-start; gap: 15px; }
  .perf__hl {
    width: 100%; max-width: 100%;
    padding: 0 15px;
    grid-template-columns: 1fr;
    gap: 30px;
    padding-top: 40px;
  }
  .hl__txt { font-size: 20px; margin: 15px 0; }
  .financial-links {
    flex-direction: column;
        gap: 16px;
        padding: 0 20px;
        margin-top: 20px;
        padding-left: 0px;
        margin-left: 20px;
  }

  /* VALUE */
  .value { padding: 40px 0; }
  .value__title { font-size: 32px; }
  .value__head { padding: 0 20px; margin-bottom: 30px; }

  /* FOOTER */
  .foot { padding: 20px 15px; }
  .value-distribution-sec .amount span { font-size: 32px; }
  .value-distribution-sec .amount small {font-size: 20px;}
  #value .value-distribution-sec .value-card h3 {
    height: auto; margin: 0 0 10px;
}
.value-distribution-sec .amount-block {
    margin-bottom: 17px;
}

.value-added-section .value-content h2 {font-size: 26px;}
.value-added-section .value-content h3 {font-size: 20px;}
.value-added-section .main-value {display: flex;font-size: 42px;}
.value-added-section .main-value span { margin-top: 0px; }
.value-added-section .main-value span.main-value-unit { padding-top: 15px; } 
.value-added-section .previous-year {font-size: 17px;}
#IntegratedApproachGrowth .heading_world h2 { font-size: 26px; }
    .risk-governance {
        padding: 40px 0;
    }
    .risk-governance .section-title {
        font-size: 34px;
    }
    .risk-governance .risk-card .card-number {bottom: -30px;}
    #IntegratedApproachGrowth .heading_world h2 {width: 310px;}
    #IntegratedApproachGrowth .heading_world {
        left: 1em;top: 1em;
    } 
    #IntegratedApproachGrowth .esg-links-list {width: 300px;right: 0px;
    width: 100%;
    top: 80px;}
    #IntegratedApproachGrowth .esg-links-list li a {right: 0px;width: 100%;
    top: 80px; height: 95px; min-height:auto;height: auto;padding: 5px 0;}
    
    #IntegratedApproachGrowth .circle_wrap {margin-top: 210px;}
    #IntegratedApproachGrowth .circle_p.base_txt {width: 250px;}
/*     #IntegratedApproachGrowth .scroll_track {
    height: 71vh;
    position: relative;
    background: #fff;
    overflow: hidden;
} */
   /*  #IntegratedApproachGrowth { height: 1000px; overflow: hidden; } */

.btn-readmore, .blackBtn { font-size: 15px;margin-bottom: 7px; }
#RetailSection .scot-card li, #DigitalSection .scot-card li, #MediaEntertainmentSection .scot-card li, #OilChemicals .scot-card li, #OilGas .scot-card li { font-size: 14px; }
    .custom-breadcrumb .container {
        gap: 3px;
    }
    .custom-breadcrumb .separator svg {
        width: 5px;
    }
    #riskgovernance .risk-governance {
    padding: 27px 0;
}
#riskgovernance .risk-governance .risk-item .risk-accordion-toggle {font-size: 16px;padding: 18px 10px;}
#riskgovernance .risk-governance .risk-response-section h3 {
        font-size: 20px;
    }
    #AwardsRecognitions .recognition-section {
    padding: 40px 0;
}
#AwardsRecognitions .recognition-col ul, #AwardsRecognitions .retail-card ul {padding-left: 0px;}

/* Business Opportunities – Growth Drivers table: stack on mobile */
#businessOpportunities .bo-growth-drivers .table-responsive { overflow-x: visible; }
#businessOpportunities .bo-drivers-table,
#businessOpportunities .bo-drivers-table tbody,
#businessOpportunities .bo-drivers-table tr,
#businessOpportunities .bo-drivers-table th,
#businessOpportunities .bo-drivers-table td { display: block; width: 100%; }
#businessOpportunities .bo-drivers-table tr { border-top: 1px solid #c8c8c8; padding: 20px 0; }
#businessOpportunities .bo-drivers-table tr:last-child { border-bottom: 1px solid #c8c8c8; }
#businessOpportunities .bo-drivers-table .bo-drivers-table__term {
    width: 100%; min-width: 0;
    padding: 0 0 10px;
    border: none; background-color: #f4eff7;
    padding: 12px 14px;
    font-size: 15px;
}
#businessOpportunities .bo-drivers-table .bo-drivers-table__desc {
    padding: 12px 14px 0;
}
#businessOpportunities .bo-drivers-table .bo-drivers-table__desc p {
    font-size: 14px; line-height: 1.75;
}
}

/* ===== Integrated Approach to Sustainable Growth =====
   Desktop: scroll-driven circular timeline (unchanged).
   Mobile / tablet (<=1024px): hide the circle, show a slider with arrows. */
#IntegratedApproachGrowth .ia-mobile { display: none; }

@media only screen and (max-width: 1024px) {

    /* Collapse the tall pinned scroll track into normal flow */
    #IntegratedApproachGrowth .scroll_track { height: auto; }
    #IntegratedApproachGrowth .circle-timeline-section {
        display: block;
        height: auto;
        min-height: 0;
        padding: 30px 0;
        transition: background-color .5s ease;
    }
    #IntegratedApproachGrowth .container {
        height: auto;
        min-height: 0;
        display: block;
        padding: 0 20px;
    }

    /* Hide the desktop circle + center text */
    #IntegratedApproachGrowth .circle_wrap,
    #IntegratedApproachGrowth .center-descriptions { display: none; }

    /* Put heading + ESG links back into normal flow */
    #IntegratedApproachGrowth .heading_world {
        position: static;
        left: auto;
        top: auto;
        margin-bottom: 24px;
    }
    #IntegratedApproachGrowth .heading_world h2 {
        width: auto;
        font-size: 30px;
    }
    #IntegratedApproachGrowth .esg-links-list {
        position: static;
        right: auto;
        top: auto;
        width: 100%;
        margin: 0 0 30px;
    }
    #IntegratedApproachGrowth .esg-links-list li { width: 100%; padding: 0 0px; }

    /* Slider */
    #IntegratedApproachGrowth .ia-mobile { display: block; }
    #IntegratedApproachGrowth .iaSwiper { overflow: hidden; }
    #IntegratedApproachGrowth .iaSwiper .swiper-slide { height: auto; border: solid 1px rgba(255, 255, 255, 0.341);
        border-radius: 10px; }
    #IntegratedApproachGrowth .ia-slide {
        height: 100%;
        background: var(--c, #04af4b);
        border-radius: 12px;
        padding: 40px 28px;
        min-height: 320px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        color: #fff;
    }
    #IntegratedApproachGrowth .ia-slide img {
        width: 54px;
        height: 54px;
        object-fit: contain;
        margin-bottom: 22px;
    }
    #IntegratedApproachGrowth .ia-slide h3 {
        font-family: var(--Loos-family);
        font-size: 24px;
        font-weight: 400;
        margin-bottom: 14px;
    }
    #IntegratedApproachGrowth .ia-slide p {
        font-size: 15px;
        line-height: 1.5;
        margin-bottom: 26px;
        max-width: 420px;
    }
    #IntegratedApproachGrowth .ia-slide .know_more { color: #fff; }
    #IntegratedApproachGrowth .esg-links-list li a .arrow {transform: scale(0.8);}

    /* Arrows (white, to read on the coloured slides) */
    #IntegratedApproachGrowth .ia-nav { margin-top: 28px; }
    #IntegratedApproachGrowth .ia-nav .cardnav__btn { border-color: #fff; }
    #IntegratedApproachGrowth .ia-nav .cardnav__btn em::before { background: #fff; }
    #IntegratedApproachGrowth .ia-nav .cardnav__btn em::after { border-color: #fff; }
    #IntegratedApproachGrowth .ia-nav .cardnav__btn.is-fill { background: #fff; }
    #IntegratedApproachGrowth .ia-nav .cardnav__btn.is-fill em::before { background: #04af4b; }
    #IntegratedApproachGrowth .ia-nav .cardnav__btn.is-fill em::after { border-color: #04af4b; }
    #IntegratedApproachGrowth .ia-nav .ia-next { transform: scaleX(-1); }
    #value .value-added-section .item-5 .circle {
    top: 68px;
}

.value-distribution-sec .fy-tag {
    
    height: 24px;
    margin-top: 0px;
    font-size: 14px;
}
.tab-btn {font-size: 13px;padding-right: 10px;}
.statcard { min-height: auto; }
.tabs-nav {
        display: flex;
    }
.tab-btn {border-bottom: 1px solid #d6d0c7;}
.rise__mukesh { width: 100%; margin-top: 0px; max-width: 100%; }
.metric__tag { position: relative; left: 0px; bottom: 0px;padding: 5px 7px; }
.echart-bar {margin-bottom: 20px;}
.metric {padding: 0px; margin-bottom: 20px; padding-bottom: 10px; }
.metric__head {
    margin-bottom: 14px;
}
.metric__delta {margin-bottom: 13px;}
.perf__hl { margin-top: 0px; padding-top: 20px; }
.value-distribution-sec .value-card h3 {font-size: 15px;letter-spacing: 0;}
#rilSearchOverlay .rs-chip { text-align: left; }
#rilSearchOverlay .rs-chip,.filter-tags button {padding: 10px 10px !important;}
.topic-popup { width: 100%; }
.topic-filter h2,.results-header h3 {font-size: 24px;}
.close-popup {right: 10px;top: 10px;}
.top-btn {transform: translateY(7px);}
.filter-btn {right: 4px; bottom: 8px;}
.filter-icon,.filter-btn {width: 40px;height: 40px;}
.download-center {padding: 30px 0;}
.diversified {padding: 30px 0px;}
}

/* ===== Risk & Governance: slider on mobile/tablet, normal grid on desktop =====
   (lives here in responsive.css because home.css gets regenerated/minified) */
.risk-governance .riskSwiper { width: 100%; }
.risk-governance .riskSwiper .swiper-slide { height: auto; }
.risk-governance .risk-card { height: 100%; }
.risk-governance .risk-nav { margin-top: 34px; justify-content: flex-start; margin-left: 0; }
.risk-governance .risk-nav .risk-next { transform: scaleX(-1); }

/* Desktop (>=1025px, incl. 1366/1400): disable slider look, restore 2-col grid */
@media (min-width: 1025px) {
    .risk-governance .riskSwiper { overflow: visible; }
    .risk-governance .riskSwiper .swiper-wrapper {
        display: flex !important;
        flex-wrap: wrap;
        gap: 24px;
        transform: none !important;
    }
    .risk-governance .riskSwiper .swiper-slide {
        width: calc(50% - 12px) !important;
        flex-shrink: 0;
        margin: 0 !important;
    }
    
    
}