html { overflow-x: clip; }            /* kill horizontal scrollbar from full-bleed sliders */
/* The web Noto Sans does not bold the Indian Rupee sign (U+20B9). Wrap each
   rupee glyph in <span class="rs"> so it uses a local font that bolds it,
   inheriting the surrounding weight. */
.rs { font-family: Arial, 'Segoe UI', sans-serif; }
body {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-size: 16px;
    font-family: 'Noto Sans', sans-serif;
    color: #222;
    overflow-x: clip;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0px;
    padding: 0px;
    font-family: 'Playfair Display', serif;
}
p {
    margin: 0px;
    padding: 0px;
}

a {
    text-decoration: none !important;
    font-size: 16px;
}

a:hover {
    text-decoration: none !important;
}

p {
    font-size: 16px;
    line-height: 24px;
}

.my-sidenav {
    display: none;
}

img { display: block; max-width: 100%; }

/* ============================================================
   PRELOADER — centred logo + horizontal progress bar + counter
   ============================================================ */
.preloader {
    position: fixed; inset: 0; z-index: 100000;
    display: flex; align-items: center; justify-content: center;
    background: #ffffff;
    transition: opacity .6s ease, visibility .6s ease;
}
.preloader.is-done { opacity: 0; visibility: hidden; }
.preloader-inner { display: flex; flex-direction: column; align-items: center; }
.preloader-logo { width: 130px; height: auto; display: block; }
.preloader-bar {
    position: relative; overflow: hidden;
    width: 220px; height: 2px; margin-top: 30px;
    background: #e6e6e6; border-radius: 2px;
}
.preloader-fill {
    position: absolute; top: 0; left: 0; height: 100%; width: 0;
    border-radius: 2px;
    background: linear-gradient(90deg, #1565C0 0%, #7B2FA8 50%, #C01535 100%);
    transition: width .25s ease;
}
.preloader-num {
    margin-top: 16px;
    font-family: 'Noto Sans', sans-serif;
    font-size: 13px; font-weight: 600; letter-spacing: .5px;
    color: #8a8a8a;
}

/* ============================================================
   HEADER
   ============================================================ */
:root {
    --header-bg:     rgba(255, 255, 255, 0.6);
    --header-border: rgba(0, 0, 0, 0.06);
    --header-shadow: 0 5px 18px rgba(0, 0, 0, 0.10);
    --text-primary:  #1a1a1a;
    --text-secondary:#555555;
    --divider:       rgba(0, 0, 0, 0.18);
    --hover-bg:      rgba(0, 0, 0, 0.06);
    --brand-purple:  #8e278f;
    --brand-blue:    #006db7;
}

.header-fixed {
    position: fixed;
    top: 20px;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: transform .4s ease;
}
/* hidden when scrolling down, slides back in on scroll up */
.header-fixed.header-hidden {
    transform: translateY(-160%);
}

.site-header {
    background: var(--header-bg);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid var(--header-border);
    box-shadow: var(--header-shadow);
    transition: box-shadow .35s ease;
}
.header-fixed.sticky .site-header {
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}
.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
}
.header-left { display: flex; align-items: center; gap: 18px; }

.header-logo { display: flex; align-items: center; flex-shrink: 0; }
.header-logo img { height: 46px; width: auto; }

.header-divider { width: 1px; height: 46px; background: var(--divider); flex-shrink: 0; }
.header-title { display: flex; flex-direction: column; gap: 3px; }
.company-name {
    font-size: 15px; font-weight: 600; color: var(--text-primary);
    line-height: 1.3; white-space: nowrap;
}
.report-subtitle {
    font-size: 12.5px; font-weight: 400; color: var(--text-secondary);
    line-height: 1.3; white-space: nowrap;
}

.header-right { display: flex; align-items: center; gap: 10px; }
.search-btn {
    background: none; border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 50%;
    color: var(--text-primary);
    transition: background .2s;
}
.search-btn:hover { background: var(--hover-bg); }
.search-btn svg { width: 22px; height: 22px; }

.menu-btn {
    display: flex; align-items: center; gap: 9px;
    padding: 9px 20px; cursor: pointer;
    background: linear-gradient(90deg, #1565C0 0%, #7B2FA8 50%, #C01535 100%);
    border: none; color: #fff;
    font-size: 14.5px; font-weight: 500; letter-spacing: .2px;
    transition: opacity .2s, transform .15s;
}
.menu-btn:hover { opacity: .9; transform: scale(1.02); }
.hamburger { display: flex; flex-direction: column; gap: 4px; justify-content: center; }
.hamburger span { display: block; width: 16px; height: 1.8px; background: #fff; border-radius: 2px; }

/* ============================================================
   HERO / BANNER
   ============================================================ */
.hero-section {
    position: relative;
    height: 100vh;
    min-height: 640px;
    overflow: hidden;
    background: #f0ebe3;
}
.hero-video-wrap { position: absolute; inset: 0; z-index: 1; transition: opacity 1s ease; }
.hero-video-wrap.is-hidden { opacity: 0; }
.hero-video {
    width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    display: block;
}

/* Banner content container */
.hero-container {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    pointer-events: none;
}

/* Right-side heading + CTA + icons */
.banner-right-panel {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    pointer-events: auto;
    opacity: 0;                       /* JS sets opacity to 1 when the video completes */
    transition: opacity 0.8s ease;    /* smooth 0 -> 100% fade-in on completion */
}
.banner-right-panel.is-visible {
    opacity: 1;
}
.brp-heading {
    font-family: 'Playfair Display', serif;
    font-size: clamp(28.6px, 3.3vw, 46.2px);
    font-weight: 700;
    line-height: 1.12;
    color: var(--brand-purple);
    margin: 0 0 28px;
}

/* Read More button (outlined blue) */
.cta-read-more {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 22px;
    border-radius: 50px;
    cursor: pointer;
    text-decoration: none;   /* the CTA is an <a> in most sections */
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .3px;
    background: transparent;
    color: #008851;
    border: 2px solid #008851;
    transition: background .25s ease, color .25s ease;
}
.cta-read-more .cta-arrow { display: flex; align-items: center; transition: transform .25s ease; }
.cta-read-more:hover { background: #008851; color: #fff; }
.cta-read-more:hover .cta-arrow { transform: translateX(4px); }

/* Sector icons strip */
.brp-icons-bottom {
    display: flex;
    gap: 36px;
    margin-top: 40px;
}
.brp-icon-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    border-right: .5px solid #00000020;
    padding-right: 40px;
}
.brp-icons-bottom .brp-icon-item:last-child
{
border-right: none;
}
.brp-icon-circle {
    display: flex; align-items: center; justify-content: center;
}
.brp-icon-circle img { width: 66px; height: 66px; object-fit: contain; }
.brp-icon-item span {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #1a1a1a;
    text-align: center;
    line-height: 1.3;
    white-space: nowrap;
}

/* ============================================================
   MESSAGE FROM THE CHAIRMAN
   ============================================================ */
.chairman-section {
    position: relative;
    background: url('../images/bg.jpg') center center / cover no-repeat;
    overflow: hidden;
    height: 100vh;
    display: flex;
    align-items: flex-end;
}
.md-section
{
     background: url('../images/bg02.jpg') center center / cover no-repeat;
}
.chairman-row {
    display: flex;
    align-items: flex-end;
    min-height: 88vh;
}
.chairman-img-col {
    flex: 0 0 44%;
    max-width: 44%;
    display: flex;
    align-items: flex-end;
}
.chairman-img-col img {
    width: 100%;
    height: auto;
    display: block;
}
.chairman-content-col {
    flex: 1;
    align-self: center;
    padding: 0 0 0 50px;
    max-width: 620px;
}
.chairman-label {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 18px;
}
.chairman-title {
    font-family: 'Playfair Display', serif;
    font-size:40px;
    font-weight: 700;
    line-height: 1.12;
    color:#008851;
    margin-bottom: 22px;
}
.chairman-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    color: #333;
    margin-bottom:30px;
}
.chairman-name {
    font-family: 'Playfair Display', serif;
    font-size: 30px;
    font-weight: 700;
    color:#008851;
    letter-spacing: 1px;
    margin-bottom:40px;
}

/* Managing Director — same layout mirrored: image right, content left */
.md-section .chairman-row { flex-direction: row-reverse; }
.md-section .chairman-content-col {
    padding: 0 50px 0 0;
    margin-left: auto;
}

/* Managing Director (duplicate band) — image left, content right */
.md-section.md-section-alt .chairman-row { flex-direction: row; }
.md-section.md-section-alt .chairman-content-col {
    padding: 0 0 0 50px;
    margin-left: 0;
}

/* ============================================================
   ADANI PORTFOLIO OF COMPANIES — scroll-driven slideshow
   ============================================================ */
.pf-scroll {
    position: relative;
    height: 100vh;
    background: #e9f6fc;
}
.pf-stage {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

/* Background — base image + sliced "shatter" layer.
   Base and slices use identical sizing so the assembled slices match the
   base pixel-for-pixel (no jump when the transition completes). */
.pf-bgbase {
    position: absolute; inset: 0; z-index: 1;
    background-size: 100% 100%; background-position: 0 0;
}
.pf-bgslices { position: absolute; inset: 0; z-index: 2; overflow: hidden; }
.pf-slice {
    position: absolute; left: 0; width: 100%;
    background-repeat: no-repeat;
    visibility: hidden;
    will-change: transform;
}
.pf-scrim {
    position: absolute; inset: 0; z-index: 3;
    background: rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

/* UI rail — centered to the same container as the header */
.pf-ui { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
.pf-ui-inner {
    position: relative; height: 100%;
    padding-left: 0; padding-right: 0;
}

/* Left title — aligned to header content (16px inside the container) */
.pf-titlebar {
    position: absolute; left: 15px; top: 50%; transform: translateY(-50%);
    width: 330px; max-width: 40%;
    pointer-events: auto;
}
.pf-eyebrow {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700;
    color: #fff; margin-bottom: 14px;
}
.pf-gradient {
    font-family: 'Playfair Display', serif;
    font-size:40px;
    font-weight: 700; line-height: 1.15;
   color: #ffffff;
}
.pf-title-cta
{
    margin-top: 28px;
    color: #fff;
    border-color: #fff;
}
.pf-title-cta:hover { background: #fff; color: #008851; }
/* Right-side figures (per slide) */
.pf-figs {
    position: absolute; right: 16px; top: 50%; z-index: 5;
    transform: translateY(-50%);
    pointer-events: auto;
    display: flex; flex-direction: column;
    min-width: 240px;
}
.pf-figs-fy {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; font-weight: 700; color: #fff;
    padding-bottom: 12px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.7);
    margin-bottom: 4px;
}
.pf-fig {
    display: flex; flex-direction: column; gap: 4px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.pf-fig-label {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; color: rgba(255, 255, 255, 0.85);
}
.pf-fig-val {
    font-family: 'Noto Sans', sans-serif;
    font-size: 42px; font-weight: 800; color: #fff; line-height: 1;
}
.pf-figs-unit {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; color: rgba(255, 255, 255, 0.7);
    margin-top: 10px;
}

/* Prev / next arrows */
.pf-nav {
    position: absolute; right: 16px; bottom: 40px; z-index: 6;
    display: flex; gap: 14px;
    pointer-events: auto;
}
.pf-arrow {
    width: 48px; height: 48px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: transparent; cursor: pointer;
    border: 1.5px solid rgba(255, 255, 255, 0.7); color: #fff;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.pf-arrow:hover { background: #fff; color: #1a1a1a; border-color: #fff; }

/* Fixed beige card */
.pf-cardframe {
    position: absolute; top: 0; left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    width: min(430px, 86vw);
    height: 100vh;
    background: #e9f6fc;
}
.pf-card-inner {
    height: 100%;
    padding: 40px 38px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
}
.pf-counter {
    font-family: 'Noto Sans', sans-serif;
    font-size: 13px; letter-spacing: 3px; font-weight: 600;
    color: #7a7464; margin-bottom: 0px;
}
.pf-head { margin-bottom: 10px; }
.pf-company {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 20px; font-weight: 700;
    color: #2b2b2b; margin-bottom: 0px;
}
.pf-largest {
    display: block;;
    font-size: clamp(22px, 2vw, 30px); font-weight: 400;
    color: #2b2b2b; line-height: 1.1;
}
.pf-largest strong { font-weight: 700; font-size:72px; display:block; }

/* Image box — images slide vertically (one over another) */
.pf-imagebox {
    position: relative;
    width: 100%; height: 230px;
    overflow: hidden;
}
.pf-imagebox img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    transform: translateY(100%);
    transition: transform 0.85s cubic-bezier(0.76, 0, 0.24, 1);
    will-change: transform;
}

.pf-foot { margin-top: 24px; display: flex; flex-direction: column; align-items: center; gap: 0px; }
.pf-sub {
    font-family: 'Noto Sans', sans-serif;
    font-size: 20px; color: #4a4a4a; line-height: 1.45;
    max-width: 320px;
}
.pf-fade { will-change: opacity; }
.pf-discover {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 22px; border-radius: 50px; cursor: pointer;
    background: transparent;
    border: 1.5px solid #3a3a3a;
    font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 500;
    color: #2b2b2b;
    transition: background 0.25s ease, color 0.25s ease, transform 0.2s ease;
}
.pf-discover:hover { background: #2b2b2b; color: #fff; transform: translateY(-2px); }
.pf-arrow { font-style: normal; font-size: 16px; }

/* ============================================================
   STABLE, PREDICTABLE GROWTH — tabs
   ============================================================ */
.growth-section { background: #fff; padding: 80px 0px; }
.industry-section { background: #fff; padding: 20px 0 80px; }
.growth-title {
    font-family: 'Playfair Display', serif;
    font-size: 40px;
    font-weight: 700; line-height: 1.15;
    color:#008851;
    text-align: center;
    margin-bottom: 44px;
}

/* Stacked blocks (headings one below another, separated by a line) */
.growth-blocks { display: flex; flex-direction: column; }
.growth-block { padding: 40px 0; border-bottom: 1px solid #e2e2e2; }
.growth-block:last-child { border-bottom: none; }
.growth-block:first-child { padding-top: 0; }
.growth-block-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px; font-weight: 700; line-height: 1.2;
    margin-bottom: 26px;
}
/* Heading accent per block */
.growth-block[data-block="0"] .growth-block-title { color: #1b8fc4; }
.growth-block[data-block="1"] .growth-block-title { color: #8e44ad; }
.growth-block[data-block="2"] .growth-block-title { color: #8e44ad; }

/* Stat grid */
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.stat { padding: 22px 34px; border-left: 1px solid #e6e6e6; }
.stat:nth-child(3n+1) { border-left: none; padding-left: 0; }
.stat:nth-child(n+4) { border-top: 1px solid #e6e6e6; padding-top: 30px; }
/* Block 2 (5 stats): full-width divider under the first row (incl. 3.32x) */
.growth-block[data-block="1"] .stat:nth-child(-n+3) { border-bottom: 1px solid #e6e6e6; padding-bottom: 30px; }
.growth-block[data-block="1"] .stat:nth-child(n+4) { border-top: none; padding-top: 30px; }
.growth-block[data-block="1"] .stat:nth-child(5) { border-right: 1px solid #e6e6e6; }
.stat-num {
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(30px, 3.4vw, 46px); font-weight: 800;
    color: #3a3a3a; line-height: 1.05; margin-bottom: 12px;
}
.stat-num .cur { font-size: 0.55em; font-weight: 600; vertical-align: 0.18em; }
.stat-num .unit { font-size: 0.42em; font-weight: 500; color: #777; }
.stat-num .unit-lead { font-size: 0.55em; font-weight: 700; }
.stat-purple .stat-num { color: var(--brand-purple); }
.stat-purple .stat-num .unit,
.stat-purple .stat-num .cur { color: var(--brand-purple); opacity: .85; }
.stat-label {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; color: #444; line-height: 1.4;
}
.stat-note { font-size: 12.5px; color: #9a9a9a; margin-top: 6px; }
.stat-cagr {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; color: #555; margin-top: 14px;
}
.stat-cagr .tri { color: #5fb1a1; font-style: normal; font-size: 12px; margin-right: 4px; }
.stat-cagr b { color: var(--brand-blue); font-weight: 700; }

/* Graph slider (tab 4) — two graphs per slide */
.graph-swiper { width: 100%; }
.graph-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:200px;
    align-items: start;
}
.graph-cell img { width: 100%; height: auto; display: block; }
.graph-swiper-footer {
    display: flex; align-items: center; justify-content: space-between;
    margin-top:30px;
}
.graph-swiper .swiper-pagination {
    position: static; display: flex; gap: 10px; width: auto;
}
.graph-swiper .swiper-pagination-bullet {
    width: 9px; height: 9px; background: #c9c2d6; opacity: 1;
}
.graph-swiper .swiper-pagination-bullet-active { background: var(--brand-purple); }
.graph-nav { display: flex; gap: 12px; }
.graph-arrow {
    width: 42px; height: 42px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: transparent; cursor: pointer;
    border: 1.5px solid #c9c2d6; color: #8e278f;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.graph-arrow:hover { background: #8e278f; border-color: #8e278f; color: #fff; }
.graph-arrow.swiper-button-disabled { opacity: .35; cursor: default; }
.graph-arrow.swiper-button-disabled:hover { background: transparent; color: #8e278f; border-color: #c9c2d6; }

/* ============================================================
   AFTERMARKET / INDUSTRY-LEADING — card slider
   ============================================================ */
.aft-section { position: relative; overflow: hidden; }
.aft-bgs { position: absolute; inset: 0; z-index: 0; }
.aft-bg {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    opacity: 0; transition: opacity .8s ease;
}
.aft-bg.is-active { opacity: 1; }
.aft-overlay { position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, 0.5); }

.aft-inner {
    position: relative; z-index: 2;
    display: flex; align-items: center; gap: 40px;
    min-height: 100vh;
}

/* Left column — heading only */
.aft-left { flex: 1; max-width: 480px; }
.aft-head {
    font-family: 'Playfair Display', serif;
    font-size:40px; font-weight: 700;
    line-height: 1.15; color: #fff;
}

/* Right column — card slider */
.aft-right {
    flex: 1; position: relative;
    display: flex; align-items: center; justify-content: center;
    padding: 0 56px;
}
.aft-swiper { width: 100%; max-width: 440px; overflow: hidden; }
.aft-card {
    background: #fff; border-radius: 14px;
    padding: 16px 16px 26px;
}
.aft-card-img { border-radius: 10px; overflow: hidden; }
.aft-card-img img { width: 100%; height: 250px; object-fit: cover; display: block; }
.aft-card-title {
    font-family: 'Playfair Display', serif;
    font-size: 24px; font-weight: 600; color: #1f1f1f;
    margin: 20px 4px 8px;
}
.aft-card-sub {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; color: #666; margin: 0 4px;
}
/* Graph-only card */
.aft-card-graph { padding: 24px 22px; }
.aft-card-graph img { width: 100%; height: auto; display: block; }

/* Pagination bars (hidden) */
.aft-pagination { display: none; }
.aft-pagination .swiper-pagination-bullet {
    width: 28px; height: 4px; border-radius: 2px;
    background: #cfcabf; opacity: 1; transition: background .2s, width .2s;
}
.aft-pagination .swiper-pagination-bullet-active { background: #e8862e; width: 40px; }

/* Arrows flanking the card */
.aft-arrow {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
    width: 46px; height: 46px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255, 255, 255, 0.65); cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.15); color: #555;
    transition: background .2s ease, color .2s ease;
}
.aft-arrow:hover { background: #fff; color: #1f1f1f; }
.aft-prev { left: 0; }
.aft-next { right: 0; }

/* ============================================================
   PERFORMANCE HIGHLIGHTS  (scroll-driven split + image reveal)
   Base = mobile/static layout. Desktop animation is in the
   @media (min-width:1026px) block (and driven by js/app.js).
   ============================================================ */
.ph-section { position: relative; background: #fff; padding: 70px 0; overflow: hidden; }

/* Heading words */
.ph-headwrap {
    display: flex; align-items: center; justify-content: center;
    gap: 14px; flex-wrap: wrap; text-align: center;
}
.ph-t1, .ph-t2 {
    font-family: 'Playfair Display', serif;
    font-weight: 700; line-height: 1.1;
    font-size:40px;
    color:#008851;
    margin: 0;
}

/* Mobile-only header (above the image) — hidden on tablet/desktop */
.ph-mobile-head { display: none; }

/* Reveal image */
.ph-img { margin: 36px auto 0; max-width: 980px; position: relative; }
.ph-img img { width: 100%; height: auto; display: block; border-radius: 16px; }
/* Dark overlay — fades in (via JS) only after the image is full.
   Sits at section level, above the image (z2) but below the numbers (z6). */
.ph-scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.5); opacity: 0; z-index: 5; pointer-events: none; }

/* Frosted data box */
.ph-databox-wrap { margin: 40px auto 0; }
.ph-databox {
    background: transparent;
    padding: 40px 48px;
}
.ph-eyebrow {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 700; letter-spacing: .3px;
    color: #2a2a2a;
    text-align: center; margin-bottom: 8px;
}
.ph-box-title {
    font-family: 'Playfair Display', serif;
    font-size: 40px; font-weight: 700; color: var(--brand-purple);
    text-align: center; margin-bottom: 34px;
}
.ph-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.ph-cell { padding: 18px 30px; border-left: 1px solid #e6e6e6; }
.ph-cell:nth-child(3n+1) { border-left: none; padding-left: 0; }
.ph-cell:nth-child(n+4) { border-top: 1px solid #e6e6e6; padding-top: 26px; }
.ph-num {
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(28px, 3vw, 40px); font-weight: 800;
    color: var(--brand-purple); line-height: 1.05; margin-bottom: 10px;
}
.ph-num .cur { font-size: 0.6em; font-weight: 600; vertical-align: 0.12em; margin-right: 2px; }
.ph-num .unit { font-size: 0.4em; font-weight: 500; color: #777; }
.ph-label { font-family: 'Noto Sans', sans-serif; font-size: 15px; color: #444; line-height: 1.4; }
.ph-box-cta { text-align: center; margin-top: 34px; }

/* ---- Desktop scroll animation states ---- */
@media (min-width: 1026px) {
    .ph-section { padding: 0; }
    .ph-headwrap { height: 100vh; flex-wrap: nowrap; gap: 0; position: relative; z-index: 4; }
    /* Each word fills half the width and hugs the centre with a small equal
       gap — words sit together at the start, then split symmetrically and the
       reveal image grows from the exact centre with equal space on both sides. */
    .ph-t1 { flex: 1; text-align: right; padding-right: 10px; white-space: nowrap; }
    .ph-t2 { flex: 1; text-align: left;  padding-left: 10px;  white-space: nowrap; }
    .ph-img {
        position: absolute; inset: 0; margin: 0; max-width: none;
        height: 100vh; width: 100%; z-index: 2;
        transform: scale(0); opacity: 0;
    }
    .ph-img img { height: 100%; object-fit: cover; object-position: center; border-radius: 0; }
    .ph-databox-wrap {
        position: absolute; left: 50%; transform: translateX(-50%);
        bottom: 40px; width: 100%; margin: 0; z-index: 6; opacity: 0;
    }
    .ph-databox { padding: 36px 90px; }
    /* white text over the darkened image */
    .ph-eyebrow { color: rgba(255, 255, 255, 0.9); }
    .ph-box-title { color: #fff; }
    .ph-num { color: #fff; }
    .ph-num .cur { color: #fff; }
    .ph-num .unit { color: rgba(255, 255, 255, 0.8); }
    .ph-label { color: rgba(255, 255, 255, 0.9); }
    .ph-cell { border-left-color: rgba(255, 255, 255, 0.28); }
    .ph-cell:nth-child(n+4) { border-top-color: rgba(255, 255, 255, 0.28); }
    .ph-box-cta .cta-read-more { color: #fff; border-color: #fff; }
    .ph-box-cta .cta-read-more:hover { background: #fff; color: #008851; }
}

/* ============================================================
   ABOUT AEL  (scroll-driven: text rises, image grows fullscreen)
   Base = mobile/static. Desktop animation in @media + js/app.js.
   ============================================================ */
.about-section {
    position: relative;
    background: rgb(239, 234, 225);
    overflow: hidden;
    min-height: 100vh;
}
.about-section > .container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    min-height: 100vh;
}
.about-content {
    width: 50%;
    display: flex; flex-direction: column; align-items: flex-start;
    padding: 70px 50px 70px 0;
}
.about-label {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700; color: #2a2a2a;
    margin-bottom: 16px;
}
.about-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(30px, 4.2vw, 40px);
    font-weight: 700; line-height: 1.12; color:#008851;
    margin: 0 0 20px;
}
.about-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; line-height: 1.6; color: #444;
    margin: 0 0 28px; max-width: 560px;
}
.about-media { position: absolute; top: 0; right: 0; width: 50%; height: 100%; z-index: 1; overflow: hidden; }
.about-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; will-change: transform; }

/* ============================================================
   BUSINESS SEGMENT PERFORMANCE REVIEW  (expanding card slider)
   Active card grows (350 -> 730px); the inner image stays a fixed
   730px so narrow cards show a cropped centre that "opens up".
   Driven by Swiper (virtualTranslate) + manual step — see custom.js.
   ============================================================ */
.bsp-section {
    position: relative;
    background: #fff;                     /* white */
    padding: 80px 0;
    overflow: hidden;
    --bsp-card:    350px;                 /* normal card width  */
    --bsp-active:  730px;                 /* active card width   */
    --bsp-h:       490px;                 /* card height         */
    --bsp-radius:  15px;
}
.bsp-title {
    font-family: 'Playfair Display', serif;
    font-size: 40px; font-weight: 700; line-height: 1.15;
    color: var(--brand-purple);
    text-align: center;
    margin-bottom: 44px;
}
/* Left edge aligned to the header container (logo). Track bleeds off right.
   .bsp-nav shares the same padding so the arrows line up under the card. */
.bsp-colwrap, .bsp-nav { padding-left: 16px; }
@media (min-width: 992px)  { .bsp-colwrap, .bsp-nav { padding-left: calc((100% - 960px)  / 2 + 16px); } }
@media (min-width: 1200px) { .bsp-colwrap, .bsp-nav { padding-left: calc((100% - 1140px) / 2 + 16px); } }
@media (min-width: 1400px) { .bsp-colwrap, .bsp-nav { padding-left: calc((100% - 1320px) / 2 + 16px); } }

/* margin:0 overrides Swiper's default margin:auto (which centred the card) */
.bsp-swiper { position: relative; margin-left: 0; margin-right: 0; max-width: var(--bsp-active); overflow: visible; cursor: grab; }
.bsp-swiper.is-grabbing { cursor: grabbing; }
.bsp-swiper .swiper-slide {
    max-width: var(--bsp-card);
    overflow: hidden;
    transition: max-width 1s ease;       /* matches Swiper speed (1000ms) */
}
.bsp-swiper .swiper-slide.swiper-slide-active { max-width: var(--bsp-active); }

/* Image frame */
.bsp-slide-div {
    position: relative;
    height: var(--bsp-h);
    border-radius: var(--bsp-radius);
    overflow: hidden;
}
.bsp-pic {
    position: absolute; top: 0; bottom: 0; left: 50%;
    transform: translateX(-50%);
    width: var(--bsp-active); height: 100%;
    overflow: hidden;
    border-radius: var(--bsp-radius);
    transition: all .5s ease;
}
.bsp-pic img {
    width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    border-radius: var(--bsp-radius);
    transition: transform .8s ease-in-out;
}
.bsp-slide-div:hover .bsp-pic img { transform: scale(1.12); }
/* bottom scrim so the caption stays legible */
.bsp-slide-div::after {
    content: ""; position: absolute; inset: 0;
    border-radius: var(--bsp-radius);
    background: linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0) 42%);
    pointer-events: none;
}

/* Caption overlay (bottom-left, italic serif w/ underline) */
.bsp-caption {
    position: absolute; left: 40px; bottom: 46px; width: 80%; z-index: 2;
    pointer-events: none;
}
.bsp-caption h5 {
    color: #fff;
 font-weight: 500;
    font-size: 20px; line-height: 28px;
    margin: 0;
}
.bsp-cap-desc {
    color: rgba(255, 255, 255, .9);
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; line-height: 1.5;
    margin: 8px 0 0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Footer row: arrows pinned left (aligned with the card), Read More centred */
.bsp-footer { position: relative; margin-top: 36px; min-height: 46px; }
.bsp-nav { display: flex; gap: 12px; align-items: center; }
.bsp-more {
    position: absolute; top: 0; bottom: 0; left: 0; right: 0;
    display: flex; align-items: center; justify-content: center;
    pointer-events: none;                /* let arrow clicks through the centred overlay */
}
.bsp-more .cta-read-more { pointer-events: auto; }
.bsp-arrow {
    width: 50px; height: 50px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: transparent; cursor: pointer;
    border: 1.5px solid #c9c2d6; color: var(--brand-purple);
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.bsp-arrow:hover { background: #008851; border-color: #008851; color: #fff; }
.bsp-arrow.swiper-button-disabled { opacity: .35; cursor: default; }
.bsp-arrow.swiper-button-disabled:hover { background: transparent; color: #008851; border-color: #c9c2d6; }

/* Side arrows — prev on the left, next on the right, vertically centred on the cards */
.bsp-colwrap { position: relative; }
.bsp-nav { position: static; padding: 0; }
.bsp-prev, .bsp-next {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 6;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 5px 16px rgba(0, 0, 0, .14);
}
/* left arrow sits ON the first card (container offset + 16px inset) */
.bsp-prev { left: 32px; }
@media (min-width: 992px)  { .bsp-prev { left: calc((100% - 960px)  / 2 + 32px); } }
@media (min-width: 1200px) { .bsp-prev { left: calc((100% - 1140px) / 2 + 32px); } }
@media (min-width: 1400px) { .bsp-prev { left: calc((100% - 1320px) / 2 + 32px); } }
.bsp-next { right: 16px; }
.bsp-prev:hover, .bsp-next:hover { background: var(--brand-purple); }

/* ============================================================
   BUSINESS MODEL — EMPOWERED TO DELIVER VALUE  (capital tabs)
   Each panel sets --cap (its accent). The shared bottom block's
   --cap is updated by JS to follow the active tab.
   ============================================================ */
/* --cap-bg = active capital colour (set by JS on the section) */
.bm-section { background: #f4f6f8; padding: 80px 0; --cap-bg: #8e278f; }
.bm-eyebrow {
    display: block; text-align: center;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700;
    color: #1a1a1a; margin-bottom: 12px;
}
.bm-title {
    font-family: 'Playfair Display', serif;
    font-size: 40px; font-weight: 700; color:#008851;
    text-align: center; margin-bottom: 36px;
}

/* Tabs — a coloured indicator slides behind the active tab and, via the two
   curved SVGs, merges smoothly into the coloured body (notched-tab effect). */
.bm-tabs { display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: space-between; gap: 0; position: relative; z-index: 2; }
.bm-select { display: none; }   /* shown only on mobile (replaces the tab row) */
.bm-tab {
    position: relative; z-index: 1;
    background: none; border: none; cursor: pointer;
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 600; color: #2b2b2b;
    padding: 16px 4px; white-space: nowrap;
    transition: color .25s ease;
    letter-spacing: -0.8px;
}
.bm-tab[data-tab="0"] { padding-left: 14px; }
.bm-tab[data-tab="5"] { padding-right: 14px; }
.bm-tab:not(.is-active):hover { color: #000; }
.bm-tab.is-active { color: #fff; }

.bm-indicator {
    position: absolute; top: 0; left: 0; height: 100%; z-index: 0;
    background: #008851;
    transition: transform .55s cubic-bezier(.77, 0, .18, 1),
                width .55s cubic-bezier(.77, 0, .18, 1),
                background .3s ease;
}
.bm-indicator svg { position: absolute; bottom: 0; height: 100%; width: auto; }
.bm-indicator svg path { fill: #008851; transition: fill .3s ease; }
.bm-ind-l { right: 98%; }
.bm-ind-r { left: 98%; }
.bm-indicator.is-first { border-top-left-radius: 14px; }
.bm-indicator.is-first .bm-ind-l { display: none; }
.bm-indicator.is-last { border-top-right-radius: 14px; }
.bm-indicator.is-last .bm-ind-r { display: none; }

/* Coloured body block (background follows the active capital) */
.bm-body {
    background: #008851;
    border-radius: 20px;
    padding: 30px 40px 30px;
    color: #fff;
    position: relative; z-index: 1;
    transition: background .3s ease;
}
/* square the corner that connects to the first / last tab */
.bm-section.cap-first .bm-body { border-top-left-radius: 0; }
.bm-section.cap-last  .bm-body { border-top-right-radius: 0; }

.bm-panel { display: none; }
.bm-panel.is-active { display: block; }

.bm-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.bm-head-left { display: flex; align-items: center; gap: 16px; }
.bm-icon { width: 52px; height: 52px; object-fit: contain; filter: brightness(0) invert(1); }
.bm-cap-title {
    font-family: 'Playfair Display', serif;
    font-size: 30px; font-weight: 700; color: #fff;
    text-transform: uppercase; letter-spacing: .5px;
}
.bm-sdg { height: 54px; width: auto; object-fit: contain; flex-shrink: 0; display:none; }

/* Input / Outcomes boxes (translucent on the coloured block) */
.bm-io {
    display: grid; grid-template-columns: 1fr 1fr;
    border: 1px solid rgba(255,255,255,.4); border-radius: 10px; overflow: hidden;
    margin-bottom: 34px;
}
/* Outcomes column — stats stacked one below another */
.bm-out { display: inline-block; vertical-align: top; margin: 0 24px 0 0; }
.bm-out:last-child { margin-right: 0; }
.bm-out-num { font-family: 'Noto Sans', sans-serif; font-size: 22px; font-weight: 800; color: #fff; line-height: 1.1; }
.bm-out-lbl { font-size: 14px; color: rgba(255,255,255,.88); margin-top: 3px; }
.bm-io-col { padding: 22px 22px; }
.bm-io-col + .bm-io-col { border-left: 1px solid rgba(255,255,255,.4); }
.bm-io-label {
    display: block; font-family: 'Noto Sans', sans-serif;
    font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
    color: rgba(255,255,255,.75); margin-bottom: 16px;
}
.bm-io-col ul { list-style: none; margin: 0; padding: 0; }
.bm-io-col li {
    position: relative; padding-left: 18px; margin-bottom: 10px;
    font-size: 15px; line-height: 1.5; color: #fff;
}
.bm-io-col li:last-child { margin-bottom: 0; }
.bm-io-col li::before {
    content: ""; position: absolute; left: 0; top: 8px;
    width: 6px; height: 6px; border-radius: 50%; background: #fff;
}
.bm-out-m
{
    margin-top: 20px;
}

/* Actions to Enhance Outcomes — full-width row under the Input/Output/Outcomes grid */
.bm-actions {
    width: 100%;
    padding-bottom: 22px;
}
.bm-actions ul { list-style: none; margin: 0; padding: 0; }
.bm-actions li {
    position: relative; padding-left: 18px; margin-bottom: 10px;
    font-size: 15px; line-height: 1.5; color: #fff;
}
.bm-actions li:last-child { margin-bottom: 0; }
.bm-actions li::before {
    content: ""; position: absolute; left: 0; top: 8px;
    width: 6px; height: 6px; border-radius: 50%; background: #fff;
}
/* Shared bottom block — Read More CTA */
.bm-block-label { margin-bottom: 16px; color: rgba(255,255,255,.78); }

/* Both outcome numbers in ONE box, split by a divider */
.bm-stats {
    display: flex;
    background: rgba(255,255,255,.14);
    border-left: 4px solid #fff;
    border-radius: 10px;
    overflow: hidden;
}
.bm-stat { flex: 1; padding: 22px 20px; }
.bm-stat + .bm-stat { border-left: 1px solid rgba(255,255,255,.28); }
.bm-stat-num { font-family: 'Noto Sans', sans-serif; font-size: 28px; font-weight: 800; color: #fff; line-height: 1.1; }
.bm-stat-label { font-size: 14px; color: rgba(255,255,255,.88); margin-top: 4px; }

/* Read More on the coloured block → white outline */
.bm-cta { text-align: left; padding: 0 22px 6px; }
.bm-body .cta-read-more { color: #fff; border-color: #fff; background: transparent; }
.bm-body .cta-read-more:hover { background: #fff; color: #008851; }

/* ============================================================
   OUR STRATEGY — animated image-stack slider (Yes Bank style)
   ============================================================ */
.yb-slider {
    --font-body: 'Noto Sans', sans-serif;
    --font-heading: 'Playfair Display', serif;
    --yb-white: #fff;
    --yb-gold: #c79a4b;
    position: relative; width: 100%; height: 100vh; overflow: hidden;
    display: flex; flex-direction: column; z-index: 2;
    background-color: #1a3a6b;
    transition: background-color 1.2s ease;
}
/* Wrap = Bootstrap container (aligns content with the header), 16px gutter */
.yb-slider__wrap { flex: 1; display: flex; flex-direction: column; min-height: 0; width: 100%; padding-top: 90px; padding-bottom: 36px; padding-left: 16px; padding-right: 16px; }
.yb-slider__body { flex: 1; display: flex; flex-direction: column; padding: 0; min-height: 0; position: relative; }

/* LEFT */
.yb-slider__left { display: flex; flex-direction: column; flex: 1; min-height: 0; position: relative; z-index: 4; justify-content: center; }
.yb-slider__label { font-family: var(--font-body); font-size: 18px; font-weight: 700; color: rgba(255,255,255,.85); margin-bottom: 16px; }
.yb-slider__title { font-family: var(--font-heading); font-size: clamp(30px, 4vw, 40px); font-weight: 800; color: var(--yb-white); line-height: 1.15; overflow: hidden; position: relative; margin-bottom: 24px; }
.yb-slider__title span { display: inline-block; will-change: transform; }
.yb-slider__footer { flex-shrink: 0; }
.yb-slider__desc { font-family: var(--font-body); font-size: 15px; color: rgba(255,255,255,.7); line-height: 1.7; max-width: 440px; margin-bottom: 24px; }
/* Read More button (matches other sections), white variant for the dark bg */
.yb-slider .cta-read-more { color: #fff; border-color: #fff; background: transparent; }
.yb-slider .cta-read-more:hover { background: #fff; color: #1a3a6b; }

/* RIGHT (image stack) */
.yb-slider__right { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.yb-slider__images { width: 100%; height: 100%; position: relative; }
.yb-slider__slide { position: absolute; top: 50%; right: 0; left: auto; width: 55%; aspect-ratio: 1.4; overflow: hidden; border-radius: 12px; will-change: transform, filter, opacity; }
.yb-slider__slide img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.9); }

/* NAV */
.yb-slider__nav { align-self: flex-end; margin-top: 20px; display: flex; align-items: center; gap: 16px; z-index: 5; }
.yb-slider__arrow { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255,255,255,.4); background: none; color: var(--yb-white); font-size: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .3s ease, border-color .3s ease; }
.yb-slider__arrow:hover { background: var(--yb-gold); border-color: var(--yb-gold); }
.yb-slider__counter-display { font-family: var(--font-body); font-size: 13px; font-weight: 500; color: rgba(255,255,255,.6); letter-spacing: .1em; }

/* Desktop: title left, images right */
@media (min-width: 1024px) {
    .yb-slider__body { flex-direction: row; padding: 0; }
    .yb-slider__left { width: 50%; flex-shrink: 0; }
    .yb-slider__right { position: static; flex: 1; display: flex; align-items: center; justify-content: flex-end; min-height: 0; pointer-events: auto; }
    .yb-slider__images { display: flex; align-items: center; justify-content: flex-end; }
    .yb-slider__slide { width: 80%; right: 0; left: auto; }
}
@media (max-width: 767.98px) {
    .yb-slider__wrap { padding-top: 40px; }
    .yb-slider__title { font-size: clamp(24px, 9vw, 40px); }
    .yb-slider__slide { width: 90%; left: 0; margin: auto; }
    .yb-slider__desc { display: none; }
    .yb-slider__title
    {
        margin-bottom: 15px;
    }
}
/* ============================================================
   ESG — full-screen background image with left heading
   ============================================================ */
.esg-section {
    position: relative;
    min-height: 100vh;
    background: url('../images/esg-img.jpg') center center / cover no-repeat;
    display: flex;
    align-items: center;
}
.esg-section .container { width: 100%; }
.esg-title {
    font-family: 'Playfair Display', serif;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
    margin: 0;
}
@media (max-width: 767.98px) {
    .esg-section { min-height: 80vh; }
    .esg-title { font-size: clamp(28px, 8vw, 42px); }
}

/* ============================================================
   ESG FOCUS AREAS — vertical parallax slider (Swiper 11)
   ============================================================ */
.esg-slider-section { background: #fff; padding: 70px 0; }
.upk-salf-slider-wrapper {
    display: flex; flex-direction: row; position: relative;
    background: #fff; box-shadow: 0 5px 24px rgba(0,0,0,.08);
    border-radius: 10px; overflow: hidden;
    height: 400px; padding: 30px 0 30px 30px;
}
.upk-salf-slider-wrapper .swiper { flex: 1 1 auto; width: 100%; min-width: 0; height: 100%; }
.upk-salf-item { position: relative; display: flex; flex-direction: row-reverse; }
.upk-salf-item.swiper-slide-active .upk-salf-title,
.upk-salf-item.swiper-slide-active .upk-salf-desc,
.upk-salf-item.swiper-slide-active .upk-salf-button { opacity: 1; }
.upk-salf-image-wrap { height: 100%; width: 100%; }
.upk-xanc-img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }
.upk-salf-content-wrap {
    position: absolute; left: 0; bottom: 0; top: unset; max-width: 460px;
    overflow: hidden; background: rgba(255,255,255,.55);
    backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
    transition: backdrop-filter .9s; padding: 20px; border-radius: 8px;
}
.upk-salf-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(24px, 3vw, 40px); font-weight: 700; line-height: 1.2;
    color: #008851; margin-bottom: 18px; opacity: 1;
}
.upk-salf-desc {
    font-family: 'Noto Sans', sans-serif;
    color: #656565; font-size: 14px; line-height: 1.6; margin-bottom: 20px; opacity: 1;
}
.upk-salf-button { opacity: 1; }
.upk-salf-button .link {
    font-family: 'Noto Sans', sans-serif;
    color: #2b2d42; cursor: pointer; font-weight: 500; text-decoration: none;
    font-size: 14px; transition: color .3s ease;
}
.upk-salf-button .link:hover { color: var(--brand-purple); }
.link--arrowed { display: inline-flex; align-items: center; gap: 8px; }
.link--arrowed .arrow-icon { transition: transform .3s ease; }
.link--arrowed .arrow-icon--circle { transition: stroke-dashoffset .3s ease; stroke-dasharray: 95; stroke-dashoffset: 95; }
.link--arrowed g { stroke: currentColor; color: #2b2d42; }
.link--arrowed:hover .arrow-icon { transform: translate3d(5px, 0, 0); }
.link--arrowed:hover .arrow-icon--circle { stroke-dashoffset: 0; }
.link--arrowed:hover g { color: var(--brand-purple); }

/* Right-side rail: circular up/down arrows (same style as other sections) */
.upk-salf-nav-pag-wrap { position: absolute; top: 0; right: 0; height: 100%; width: 76px; display: flex; align-items: center; justify-content: center; }
.upk-salf-navigation { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.esg-counter {
    display: flex; flex-direction: column; align-items: center; gap: 2px; line-height: 1.1;
    font-family: 'Noto Sans', sans-serif; color: #2b2d42;
}
.esg-counter .esg-cur { font-size: 15px; font-weight: 700; }
.esg-counter .esg-sep {
    font-size: 0;                                  /* hide the dash glyph */
    width: 18px; height: 1px; margin: 3px 0;
    background: rgba(43, 45, 66, .4);
}
.esg-counter .esg-total { font-size: 13px; color: rgba(43, 45, 66, .6); }
.upk-button-prev, .upk-button-next { cursor: pointer; }

@media (min-width: 768px) {
    .upk-salf-slider-wrapper { height: 550px; padding: 60px 0 60px 60px; }
    .upk-salf-title { font-size: 36px; }
    .upk-salf-content-wrap { max-width: 400px; padding: 40px; padding-left: 0; top: 50%; transform: translateY(-50%); bottom: unset; background: rgba(255,255,255,.55); }
    .upk-salf-image-wrap { width: 86%; }
}
@media (min-width: 1024px) {
    .upk-salf-slider-wrapper { height: 600px; padding: 70px; }
    .upk-salf-title { font-size: 40px; }
    .upk-salf-content-wrap { max-width: 460px; padding: 50px; padding-left: 0; }
    .upk-salf-desc { font-size: 16px; }
    .upk-salf-button .link { font-size: 16px; }
    .upk-salf-image-wrap { width: 84%; }
}
/* ============================================================
   DOWNLOAD CENTRE
   ============================================================ */
.dc-section {
    background: linear-gradient(90deg, #1565C0 0%, #7B2FA8 50%, #C01535 100%);
    padding: 70px 0 64px;
}
.dc-title {
    font-family: 'Playfair Display', serif;
    font-size: 40px; font-weight: 700; color: #fff;
    text-align: center; margin-bottom: 44px;
}
.dc-grid {
    display: grid;
    grid-template-columns: 1fr 240px 1fr;
    border: 1px solid rgba(255, 255, 255, .35);
}
.dc-col-left, .dc-center { border-right: 1px solid rgba(255, 255, 255, .35); }

.dc-item {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 30px 30px; min-height: 100px;
    color: #fff; text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, .35);
    transition: background .25s ease;
}
.dc-col-left .dc-item:last-child, .dc-col-right .dc-item:last-child { border-bottom: none; }
.dc-item span { font-family: 'Noto Sans', sans-serif; font-size: 17px; font-weight: 600; }
.dc-item svg { width: 24px; height: 24px; flex-shrink: 0; opacity: .9; transition: transform .25s ease; }
.dc-item:hover { background: rgba(255, 255, 255, .08); }
.dc-item:hover svg { transform: translateY(3px); }

.dc-center {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; padding: 30px 18px;
}
.dc-center img { width: 168px; height: auto; display: block; box-shadow: 0 8px 22px rgba(0, 0, 0, .3); }
.dc-caption { color: #fff; font-family: 'Noto Sans', sans-serif; font-size: 15px; font-weight: 600; line-height: 1.45; margin-top: 18px; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
    background-image: linear-gradient(rgba(0,0,0,.28), rgba(0,0,0,.28)),
                      linear-gradient(90deg, #1565C0 0%, #7B2FA8 50%, #C01535 100%);
    padding: 26px 0;
}
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.footer-copy, .footer-credit { color: rgba(255, 255, 255, .9); font-family: 'Noto Sans', sans-serif; font-size: 14px; margin: 0; }
.footer-social { display: flex; align-items: center; gap: 16px; }
/* ============================================================
   PREV / NEXT page navigation (sits directly above the footer)
   Reading order follows the mega-menu; see HANDOVER.md.
   ============================================================ */
.pagenav { background: #fff; border-top: 1px solid #e6e8ea; padding: 24px 0 28px; }
.pagenav-inner { display: flex; align-items: stretch; justify-content: space-between; gap: 16px; }
.pagenav-link {
    display: inline-flex; align-items: center; gap: 12px;
    flex: 0 1 auto; max-width: 48%; min-width: 0;
    padding: 12px 16px; border: 1px solid #e6e8ea; border-radius: 4px;
    text-decoration: none; color: #1a1a1a;
    transition: border-color .2s ease, background-color .2s ease;
}
.pagenav-link:hover,
.pagenav-link:focus-visible { border-color: #2f9c6a; background: #f5faf7; text-decoration: none; color: #1a1a1a; }
.pagenav-next { margin-left: auto; }              /* keeps Next right even if Prev is absent */
.pagenav-text { display: flex; flex-direction: column; min-width: 0; }
.pagenav-next .pagenav-text { text-align: right; }
.pagenav-label {
    font-family: 'Noto Sans', sans-serif; font-size: 12px; font-weight: 700;
    letter-spacing: .04em; text-transform: uppercase; color: #2f9c6a; margin-bottom: 2px;
}
.pagenav-title {
    font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 600;
    line-height: 1.35; color: #1a1a1a;
    /* long chapter titles must not blow the row apart */
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; overflow-wrap: anywhere;
}
.pagenav-arrow {
    flex: none; width: 28px; height: 28px; border-radius: 50%;
    background: #2f9c6a; color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 15px; line-height: 1;
}

.footer-social-label { color: #fff; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 600; margin-right: 6px; }
/* Investor Relations is a text link inside .footer-social — undo the 30x30 icon-button
   styling below so it renders as a label, not a squeezed pill. */
.footer-social a.footer-social-label {
    display: inline; width: auto; height: auto;
    border-radius: 0; background: none; font-size: 14px; text-decoration: none;
}
.footer-social a.footer-social-label:hover { background: none; text-decoration: underline; }
.footer-social a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 6px;
    background: rgba(255, 255, 255, .12); color: #fff; font-size: 15px;
    transition: background .25s ease;
}
.footer-social a:hover { background: rgba(255, 255, 255, .28); }
/* ============================================================
   INFRASTRUCTURE PLATFORM CONTRIBUTION — auto tab slider
   ============================================================ */
.ipc-section {
    background: linear-gradient(90deg, #1565C0 0%, #7B2FA8 50%, #C01535 100%);
    padding: 70px 0 52px;
}
.ipc-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 3.4vw, 40px); font-weight: 700;
    color: #fff; text-align: center; line-height: 1.2; margin-bottom: 36px;
}
.ipc-card {
    max-width: 820px; margin: 0 auto;
    background: #fff; border-radius: 16px;
    box-shadow: 0 22px 55px rgba(0, 0, 0, .22);
    padding: 26px 34px 24px;
}
.ipc-card-head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid #e3e3e3; }
.ipc-fy { font-family: 'Noto Sans', sans-serif; font-size: 15px; font-weight: 700; color: #222; }
.ipc-unit { font-family: 'Noto Sans', sans-serif; font-size: 12px; color: #9a9a9a; }
.ipc-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid #ececec; }
.ipc-row-label { font-family: 'Noto Sans', sans-serif; font-size: 16px; color: #333; }
.ipc-row-val { font-family: 'Noto Sans', sans-serif; font-size: clamp(26px, 3vw, 34px); font-weight: 800; color: var(--brand-purple); letter-spacing: .5px; }
.ipc-note { font-family: 'Noto Sans', sans-serif; font-size: 11.5px; line-height: 1.55; color: rgba(142, 39, 143, .7); margin-top: 16px; }

/* Tabs with progress bars */
.ipc-tabs { display: flex; gap: 8px; margin-top: 34px; }
.ipc-tab {
    flex: 1; min-width: 0; background: none; border: none; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; gap: 12px;
    padding: 6px 4px 0;
    font-family: 'Noto Sans', sans-serif; font-size: 13px; font-weight: 600;
    letter-spacing: .5px; text-transform: uppercase;
    color: rgba(255, 255, 255, .7); transition: color .25s ease;
}
.ipc-tab:hover { color: #fff; }
.ipc-tab.is-active { color: #fff; }
.ipc-tab-label { white-space: nowrap; }
.ipc-tab-bar { width: 100%; height: 3px; background: rgba(255, 255, 255, .3); border-radius: 2px; overflow: hidden; }
.ipc-tab-fill { display: block; height: 100%; width: 0; background: #fff; border-radius: 2px; }
/*-----------Header Css End-------------*/

/* ============================================================
   ACCELERATING INFRASTRUCTURE POPUP
   ============================================================ */
.ai-popup-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.72);
    display: flex;
    align-items: stretch;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}
.ai-popup-overlay.is-open {
    opacity: 1;
    visibility: visible;
}
/* Full-screen panel with the PDF's soft blue gradient */
.ai-popup-panel {
    position: relative;
    width: 100%;
    height: 100vh;
    max-height: 100vh;
    background: linear-gradient(135deg, #ffffff 0%, #eaf6fc 45%, #d6eefa 100%);
    border-radius: 0;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
    display: flex;
    flex-direction: column;
}
.ai-popup-overlay.is-open .ai-popup-panel {
    transform: translateY(0);
}

/* Close button */
.ai-close {
    position: absolute;
    top: 22px;
    right: 26px;
    z-index: 10;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.5px solid rgba(0,0,0,0.18);
    background: rgba(255,255,255,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #333;
    transition: background 0.2s, color 0.2s;
}
.ai-close:hover { background: var(--brand-purple); color: #fff; border-color: var(--brand-purple); }

/* Scroll container */
.ai-popup-inner {
    overflow-y: auto;
    overflow-x: hidden;
    height: 100vh;
    max-height: 100vh;
    padding: 36px 60px 40px;
    -webkit-overflow-scrolling: touch;
}

/* Two-column grid: media+person box (left) | all text (right) */
.ai-grid {
    display: grid;
    grid-template-columns: 0.85fr 1fr;
    gap: 50px;
    align-items: start;
}

/* Title column — dark charcoal title with purple underline (as per PDF) */
.ai-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 3.2vw, 46px);
    font-weight: 700;
    line-height: 1.1;
    color: #2b2b2b;
    margin-bottom: 22px;
    padding-bottom: 22px;
    position: relative;
}
.ai-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 70px;
    height: 2px;
    background: var(--brand-purple);
}
/* Subhead — same grey body style, NOT highlighted (as per PDF) */
.ai-subhead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #555;
    line-height: 1.7;
    margin-bottom: 16px;
}
.ai-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    line-height: 1.7;
    color: #555;
    margin-bottom: 16px;
}
.ai-body:last-child { margin-bottom: 0; }

/* Left media column */
.ai-col-media { position: relative; }
.ai-visual {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    height: 330px;
}
.ai-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    filter: grayscale(30%);
}
.ai-visual-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(142,39,143,0.18) 0%, rgba(0,109,183,0.12) 100%);
    pointer-events: none;
}
.ai-grid-lines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    mix-blend-mode: screen;
}

/* Person card — clean white box with purple border (as per PDF) */
.ai-person-card {
    margin-top: 22px;
    border: 1.5px solid var(--brand-purple);
    border-radius: 10px;
    padding: 22px 24px;
    background: rgba(255, 255, 255, 0.55);
}
.ai-person-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(142,39,143,0.2);
    margin-bottom: 14px;
}
.ai-person-name {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #2b2b2b;
}
.ai-person-role {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    color: #555;
    line-height: 1.5;
}
.ai-person-bio {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    line-height: 1.65;
    color: #333;
    margin: 0;
}

/* ============================================================
   PORTFOLIO PAGE — A LEGACY OF VISION, LEADERSHIP & NATIONHOOD
   ============================================================ */
.pl-section {
    background: #fff;
    padding: 130px 0 80px;
}
.pl-label {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 14px;
}
.pl-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(34px, 4vw, 54px);
    font-weight: 700;
    line-height: 1.12;
    color: var(--brand-purple);
    margin-bottom: 44px;
}

/* Intro lead paragraph (no background, aligned to the heading) */
.pl-intro-box {
    padding: 0;
    margin-bottom: 50px;
}
.pl-intro-box p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 600;
    color: var(--brand-blue);
    margin: 0;
}

/* Guided-by paragraphs (left) + bird image (right) */
.pl-guided-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-bottom: 60px;
}
.pl-guided-text p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    line-height: 1.75;
    color: #444;
    margin: 0 0 18px;
}
.pl-guided-text p:last-child { margin-bottom: 0; }
.pl-guided-media {
    border-radius: 14px;
    overflow: hidden;
}
.pl-guided-media img {
    width: 100%;
    height: auto;
    display: block;
}

/* Pedigree, Vision + Values, Culture — stacked one below the other */
.pl-pvc-row {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 60px;
}
/* Vision+Values and Culture side by side */
.pl-pvc-two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px 44px;
    align-items: start;
}
.pl-col-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 16px;
}
.pl-col-title + .pl-list,
.pl-col-body + .pl-col-title { margin-top: 26px; }
.pl-title-purple { color: var(--brand-purple); }
.pl-title-blue { color: #00aeef; }
.pl-col-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    line-height: 1.75;
    color: #444;
    margin: 0;
}
.pl-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.pl-list li {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #444;
    margin-bottom: 14px;
}
.pl-list li:last-child { margin-bottom: 0; }
.pl-list li strong { color: #1a1a1a; font-weight: 700; }

/* ---- A portfolio invested in India's tomorrow (text left, image right) ---- */
.pf-tomorrow { background: #eef6fb; overflow: hidden; }
.pf-tomorrow-grid {
    display: grid;
    grid-template-columns: 2fr 3fr;   /* image gets the larger share */
    align-items: stretch;
    gap: 50px;
    min-height: 88vh;
}
.pf-tomorrow-text {
    display: flex; flex-direction: column; justify-content: center;
    padding: 70px 0;
}
.pf-tomorrow-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(30px, 3.6vw, 50px);
    font-weight: 700; line-height: 1.12; color: var(--brand-purple);
    margin-bottom: 34px;
}
.pf-tomorrow-pillars {
    display: flex; flex-direction: column;
    gap: 22px;
}
.pf-pillar span {
    display: inline-block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 19px; font-weight: 600; color: #1a1a1a; line-height: 1.4;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--brand-blue);
}
.pf-tomorrow-media {
    position: relative;   /* aligns to the container (menu) right edge */
}
.pf-tomorrow-media img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    display: block;
}

/* ---- Built Around Core Infrastructure chart ---- */
.pf-chart-section { background: #fff; padding: 80px 0; }
.pf-sec-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px;
    font-weight: 700; color: var(--brand-purple);
    margin-bottom: 16px;
}
.pf-sec-intro {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444;
    max-width: 880px; margin-bottom: 40px;
}
.pf-chart-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 6px; }
.pf-chart { min-width: 980px; }
/* Company-structure chart as a single SVG */
.pf-chart-img { margin: 8px 0 24px; }
.pf-chart-img img { width: 100%; max-width: 1040px; height: auto; display: block; }

/* adani logo centred over a thin rule */
.pf-chart-logo {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 16px;
}
.pf-chart-logo::before {
    content: ""; position: absolute; left: 16%; right: 16%; top: 50%;
    height: 1px; background: #d6d6d6;
}
.pf-chart-logo img { height: 38px; position: relative; background: #fff; padding: 0 24px; }

/* Group banners aligned to the 5-column grid */
.pf-chart-banners {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.pf-banner {
    position: relative;
    background: var(--brand-purple);
    color: #fff;
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; font-weight: 700;
    text-align: center;
    padding: 12px 10px;
    border-radius: 3px;
}
.pf-banner-flagship { grid-column: 1; }
.pf-banner-core     { grid-column: 2 / 4; }
.pf-banner-primary  { grid-column: 4; }
.pf-banner-other    { grid-column: 5; }
/* blue right-pointing arrow sitting in the gap after the banner */
.pf-banner-arrow {
    position: absolute; right: -13px; top: 50%; transform: translateY(-50%);
    width: 0; height: 0;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 12px solid var(--brand-blue);
}

/* Column heads + top tier (5-column grid) */
.pf-chart-cols {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    align-items: start;
}
.pf-chart-heads { margin-bottom: 16px; }
/* stretch top columns to equal height so the AEL connector can run full length */
.pf-chart-top { align-items: stretch; }
.pf-chart-top .pf-chart-col:first-child { position: relative; }
.pf-chart-top .pf-chart-col:first-child::after {
    content: ""; position: absolute;
    left: 50%; top: 82px; bottom: -16px;
    border-left: 2px solid var(--brand-blue);
}
.pf-col-head {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 700; color: var(--brand-blue);
    text-align: center; line-height: 1.25;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--brand-blue);
}
.pf-node {
    display: flex; flex-direction: column; align-items: center;
    text-align: center;
    border-radius: 6px;
    padding: 12px 10px;
    margin-bottom: 14px;
}
.pf-node:last-child { margin-bottom: 0; }
.pf-listed   { background: #dceefb; border: 1.5px solid #2aa6e0; }
.pf-unlisted { background: #ececec; border: 1.5px solid transparent; }
.pf-direct   { background: #fff;    border: 1.5px solid #2aa6e0; }
.pf-node-name { font-family: 'Noto Sans', sans-serif; font-size: 16px; font-weight: 700; color: #1a1a1a; }
.pf-node-sub  { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #555; margin-top: 2px; }
.pf-node-pct  { font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 600; margin-top: 8px; }
.pf-pct-family { color: var(--brand-purple); }
.pf-pct-ael    { color: #0093d0; }
.pf-pct-ambuja { color: #3a9d3a; }

/* Materials sub-group (ACC + Orient under Ambuja) */
.pf-down-arrow {
    display: block; margin: 0 auto 12px;
    width: 0; height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 9px solid var(--brand-blue);
}
.pf-subgroup {
    border: 1px solid #cfcfcf;
    border-radius: 6px;
    padding: 14px 14px 0;
}

/* Bottom band — bordered box fed by the AEL connector */
.pf-chart-lower {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-top: 16px;
}
.pf-lower-connector { position: relative; }
.pf-lower-connector::before {
    content: ""; position: absolute;
    left: 50%; top: 0; bottom: 50%; width: 50%;
    border-left: 2px solid var(--brand-blue);
    border-bottom: 2px solid var(--brand-blue);
}
.pf-lower-connector::after {
    content: ""; position: absolute;
    right: -2px; bottom: calc(50% - 7px);
    width: 0; height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 10px solid var(--brand-blue);
}
.pf-band {
    grid-column: 2 / 6;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid #c9c9c9;
    border-radius: 6px;
    padding: 18px 6px;
}
.pf-band-col { padding: 0 12px; }
.pf-band-col + .pf-band-col { border-left: 1px dashed #c2c2c2; }

/* Legend */
.pf-legend {
    display: flex; flex-wrap: wrap; gap: 12px 26px;
    margin: 34px 0 24px;
    font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #444;
}
.pf-legend-item { display: inline-flex; align-items: center; gap: 8px; }
.pf-swatch { width: 26px; height: 16px; border-radius: 3px; display: inline-block; }
.pf-sw-listed { background: #dceefb; }
.pf-sw-unlisted { background: #ececec; }
.pf-sw-direct { background: #fff; border: 1.5px solid #2aa6e0; }

/* Footnotes + abbreviations */
.pf-notes {
    margin: 0 0 18px; padding-left: 20px;
    font-family: 'Noto Sans', sans-serif; font-size: 12.5px; line-height: 1.6; color: #333;
}
.pf-notes li { margin-bottom: 6px; }
.pf-abbr {
    font-family: 'Noto Sans', sans-serif; font-size: 12.5px; line-height: 1.7; color: #333;
}

/* ---- Empowering India's Critical Sectors ---- */
.pf-critical { background: #eef7f3; padding: 80px 0; }
.pf-critical-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 700; color: var(--brand-purple); line-height: 1.1;
    white-space: nowrap;
    margin-bottom: 34px;
}
.pf-critical-intro {
    max-width: 620px;
    margin-bottom: 50px;
}
/* Page-10 block: stacked text cards + flamingo image */
.pf-uns-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 40px;
    align-items: stretch;
    margin-bottom: 54px;
}
.pf-uns-textcol { display: flex; flex-direction: column; gap: 24px; }
.pf-uns-media { border-radius: 12px; overflow: hidden; min-height: 320px; }
.pf-uns-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Empowering Critical Sectors — sectors + factory image (image matches sector height) */
.pf-sectors-row {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 40px;
    align-items: start;
}
.pf-sectors-media {
    border-radius: 12px;
    background: url('../images/portfolio-critical-plant.jpg') center center / cover no-repeat;
    height: 300px;
}

/* Enabling India's Rise — plain, left-aligned (no background) */
.pf-enabling {
    padding: 0;
    margin-bottom: 54px;
}
.pf-enabling-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px; font-weight: 700; color: #484848;
    line-height: 1.2; margin-bottom: 12px;
}
.pf-enabling p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444; margin: 0;
}
.pf-sectors-block { margin-bottom: 56px; }
.pf-card-soft {
    background: rgba(255,255,255,0.6);
    border-radius: 12px; padding: 28px 30px;
}
.pf-card-title {
    font-family: 'Noto Sans', sans-serif;
    font-size: 22px; font-weight: 700; color: #333; line-height: 1.25;
    margin-bottom: 14px;
}
.pf-card-soft p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444; margin: 0;
}
.pf-critical-grid {
    display: grid; grid-template-columns: 1fr 1.2fr; gap: 44px;
    align-items: start; margin-bottom: 56px;
}
.pf-tick-list { list-style: none; margin: 18px 0 0; padding: 0; }
.pf-tick-list li {
    position: relative; padding-left: 22px; margin-bottom: 12px;
    font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.6; color: #444;
}
.pf-tick-list li::before {
    content: ""; position: absolute; left: 0; top: 7px;
    width: 8px; height: 8px; border-radius: 50%; background: var(--brand-purple);
}
.pf-card-foot {
    font-family: 'Noto Sans', sans-serif; font-size: 12px; line-height: 1.55;
    color: #888; margin: 18px 0 0;
}
.pf-critical-media { margin-top: 24px; border-radius: 12px; overflow: hidden; }
.pf-critical-media img { width: 100%; height: auto; display: block; }

.pf-block-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px; font-weight: 700;
    color: var(--brand-purple); margin-bottom: 10px;
}
.pf-block-title.pf-title-dark { color: #484848; font-size: 22px; }
.pf-block-sub {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; color: #444; margin-bottom: 26px;
}
.pf-sectors {
    display: grid; grid-template-columns: 1fr 1fr; gap: 26px 34px;
    margin-bottom: 34px;
}
.pf-sector h5 {
    font-family: 'Noto Sans', sans-serif;
    font-size: 17px; font-weight: 700; color: #1a1a1a; margin-bottom: 8px;
}
.pf-sector p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.6; color: #555; margin: 0;
}
.pf-intel { border-top: 1px solid #d6e3dd; padding-top: 24px; }
.pf-intel-title {
    font-family: 'Playfair Display', serif;
    font-size: 22px; font-weight: 700; color: var(--brand-purple); line-height: 1.25;
    margin-bottom: 12px;
}
.pf-intel p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444; margin: 0;
}

/* Purpose-driven ESG */
.pf-purpose { border-top: 1px solid #d6e3dd; padding-top: 44px; }
.pf-esg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.pf-esg { border-radius: 10px; padding: 26px 26px; color: #fff; }
.pf-esg h5 {
    font-family: 'Noto Sans', sans-serif;
    font-size: 19px; font-weight: 700; color: #fff; margin-bottom: 16px;
}
.pf-esg ul { list-style: none; margin: 0; padding: 0; }
.pf-esg li {
    position: relative; padding-left: 18px; margin-bottom: 12px;
    font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.95);
}
.pf-esg li:last-child { margin-bottom: 0; }
.pf-esg li::before {
    content: ""; position: absolute; left: 0; top: 8px;
    width: 6px; height: 6px; border-radius: 50%; background: #fff;
}
.pf-esg li strong { font-weight: 700; color: #fff; }
.pf-esg-env { background: #0b6e6a; }
.pf-esg-soc { background: #1a7fc0; }
.pf-esg-gov { background: #b85a28; }

/* ---- Growing with the Nation (text left, image right) ---- */
.pf-growing-hero { background: #eef6fb; overflow: hidden; }
.pf-growing-grid {
    display: grid;
    grid-template-columns: 2fr 3fr;   /* image gets the larger share */
    align-items: stretch;
    gap: 50px;
    min-height: 88vh;
}
.pf-growing-text {
    display: flex; flex-direction: column; justify-content: center;
    padding: 70px 0;
}
.pf-growing-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(30px, 3.6vw, 50px);
    font-weight: 700; line-height: 1.12; color: var(--brand-purple);
    margin: 0;
}
.pf-growing-media {
    position: relative;   /* aligns to the container (menu) right edge */
}
.pf-growing-media img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    display: block;
}

/* ---- Growing with Impact (metrics) ---- */
.pf-impact { background: #fff; padding: 80px 0; }
.pf-impact-group { padding: 34px 0; border-bottom: 1px solid #e6e6e6; }
.pf-impact-group:first-child { padding-top: 0; }
.pf-impact-head {
    font-family: 'Playfair Display', serif;
    font-size: 22px; font-weight: 700; color: #1a1a1a; margin-bottom: 26px;
    display: flex; align-items: center; gap: 12px;
}
/* Placeholder icon (design team to replace the SVGs) */
.pf-impact-icon { display: inline-flex; flex-shrink: 0; }
.pf-impact-icon img { height: 40px; width: auto; display: block; }
.pf-impact-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px 50px; }
.pf-metric { }
.pf-metric-val {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(26px, 3vw, 36px); font-weight: 800;
    color: var(--brand-purple); line-height: 1.1; margin-bottom: 10px;
}
.pf-metric-val sup { font-size: 0.5em; vertical-align: super; font-weight: 600; }
.pf-metric p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.6; color: #555; margin: 0;
}
.pf-notes-impact { margin-top: 30px; }
.pf-notes-impact p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 12.5px; line-height: 1.6; color: #333; margin: 0 0 6px;
}
.pf-notes-impact p:last-child { margin-bottom: 0; }
.pf-notes-impact sup { font-size: 0.75em; }

/* ============================================================
   DRIVEN BY SYNERGIES, SIGNIFICANCE AND SUSTAINABILITY
   ============================================================ */
/* Hero — text left, larger image bleeding to the right edge */
.syn-hero { background: #eef6fb; overflow: hidden; padding-top: 110px; }
.syn-eyebrow {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700; color: #1a1a1a;
    margin-bottom: 14px;
}
.syn-hero-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(34px, 4vw, 54px);
    font-weight: 700; line-height: 1.12; color: var(--brand-purple);
    margin: 0 0 24px;
}
.syn-hero-row {
    display: grid; grid-template-columns: 2fr 3fr;   /* image gets the larger share */
    gap: 50px; align-items: stretch; min-height: 480px;
}
.syn-hero-text { display: flex; flex-direction: column; justify-content: center; padding: 20px 0 40px; }
.syn-hero-img {
    position: relative;   /* aligns to the container (menu) right edge */
}
.syn-hero-img img {
    position: absolute; inset: 0;
    width: 100%; height: 100%; object-fit: cover; object-position: center;
    display: block;
}
/* Intro copy below the banner */
.syn-intro { background: #fff; padding: 50px 0 0; }
.syn-intro-copy {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444; margin: 0;
}

/* Company blocks */
.syn-companies { background: #fff; padding: 70px 0 60px; }
/* Per-company colour coding (bar = header colour, accent = metric line/bullet) */
.syn-company { --syn-bar: #8e278f; --syn-accent: #00aeef; }
.syn-company--ael    { --syn-bar: #8e278f; --syn-accent: #00aeef; }
.syn-company--apsez  { --syn-bar: #42408e; --syn-accent: #42408e; }
.syn-company--agel   { --syn-bar: #2f9c6a; --syn-accent: #2f9c6a; }
.syn-company--aesl   { --syn-bar: #107aa1; --syn-accent: #107aa1; }
.syn-company--atgl   { --syn-bar: #007978; --syn-accent: #007978; }
.syn-company--apl    { --syn-bar: #2f2e82; --syn-accent: #2f2e82; }
.syn-company--ambuja { --syn-bar: #7c1f25; --syn-accent: #7c1f25; }
.syn-company--ndtv   { --syn-bar: #3d306d; --syn-accent: #3d306d; }
.syn-company { padding: 44px 0; border-bottom: 1px solid #e6e6e6; }
.syn-company:last-of-type { border-bottom: none; }
.syn-company:first-child { padding-top: 0; }

.syn-company-name {
    font-family: 'Playfair Display', serif;
    font-size: 22px; font-weight: 700; color: var(--syn-bar);
    margin: 0 0 4px;
}
.syn-company-tag {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 600; color: #333; margin: 0;
}
.syn-company-tag sup { font-size: 0.7em; }

/* Image (left, full height) | heading + metrics (right) */
.syn-company-top {
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 40px;
    align-items: stretch; margin-bottom: 34px;
}
.syn-company-media { position: relative; border-radius: 12px; overflow: hidden; min-height: 240px; }
.syn-company-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.syn-company-right { display: flex; flex-direction: column; justify-content: center; }
.syn-company-head { margin-bottom: 24px; }
.syn-metrics {
    display: grid; grid-template-columns: 1fr 1fr; gap: 26px 30px;
}
.syn-metric-foot { grid-column: 1 / -1; }
.syn-metric-num {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 30px; font-weight: 800; color: #3a3a3a; line-height: 1.05;
    margin-bottom: 6px;
}
.syn-metric-num .syn-metric-unit { font-size: 0.5em; font-weight: 700; color: #777; }
.syn-metric-num.syn-metric-text { font-size: 20px; font-weight: 700; }
.syn-metric-logos { display: flex; align-items: center; gap: 18px; margin-top: 12px; }
.syn-metric-logos img { height: 42px; width: auto; display: block; }
.syn-metric p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; line-height: 1.45; color: #555; margin: 0;
    position: relative; padding-top: 8px;
}
.syn-metric p::before {
    content: ""; position: absolute; top: 0; left: 0;
    width: 22px; height: 2px; background: #00aeef;
}
.syn-metric-foot {
    grid-column: 1 / -1;
    font-family: 'Noto Sans', sans-serif;
    font-size: 12px; color: #888; margin: 18px 0 0;
}

/* Contribution columns */
.syn-contrib {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
    border: 1px solid #e2e2e2; border-radius: 8px; overflow: hidden;
}
.syn-contrib-2 { grid-template-columns: repeat(2, 1fr); }
.syn-contrib-col { border-left: 1px solid #e2e2e2; }
.syn-contrib-col:first-child { border-left: none; }
.syn-contrib-head {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; font-weight: 700; color: #fff;
    background: var(--syn-bar);
    padding: 12px 18px; margin: 0;
}
.syn-contrib-col ul { list-style: none; margin: 0; padding: 18px 18px; }
.syn-contrib-col li {
    position: relative; padding-left: 16px; margin-bottom: 12px;
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; line-height: 1.5; color: #444;
}
.syn-contrib-col li:last-child { margin-bottom: 0; }
.syn-contrib-col li::before {
    content: ""; position: absolute; left: 0; top: 7px;
    width: 7px; height: 7px; background: #00aeef;
}
.syn-note {
    font-family: 'Noto Sans', sans-serif;
    font-size: 12.5px; line-height: 1.6; color: #333; margin: 40px 0 0;
}

/* ============================================================
   STABLE, PREDICTABLE INFRASTRUCTURE-LED GROWTH
   ============================================================ */
.spg-hero { background: #fff; padding: 130px 0 0; }
.spg-eyebrow {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700; color: #1a1a1a; margin-bottom: 14px;
}
.spg-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(34px, 4vw, 54px);
    font-weight: 700; line-height: 1.12; color: var(--brand-purple); margin: 0;
}

/* Section headings */
.spg-sec-title {
    font-family: 'Playfair Display', serif;
    font-size: 22px; font-weight: 700; color: #2b2b2b; margin: 0;
}

/* Performance section */
.spg-perf { background: #fff; padding: 28px 0 60px; }
.spg-perf-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }
.spg-unit { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #888; }

/* Table */
.spg-table-wrap { overflow-x: auto; margin-bottom: 44px; }
.spg-table { width: 100%; border-collapse: collapse; min-width: 640px; }
.spg-table thead th {
    background: #1976b5; color: #fff;
    font-family: 'Noto Sans', sans-serif; font-size: 15px; font-weight: 700;
    text-align: right; padding: 14px 18px; line-height: 1.3; vertical-align: bottom;
}
.spg-table thead th:first-child { text-align: left; }
.spg-table tbody td {
    font-family: 'Noto Sans', sans-serif; font-size: 16px; color: #333;
    text-align: right; padding: 13px 18px; border-bottom: 1px solid #e6e6e6;
}
.spg-table tbody td:first-child { text-align: left; color: #1a1a1a; }
.spg-table tbody td + td { border-left: 1px solid #e6e6e6; }
.spg-table tbody tr:last-child td { border-bottom: 2px solid #1976b5; }

/* Totals */
.spg-totals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-bottom: 50px; }
.spg-total-val {
    display: block;
    font-family: 'Noto Sans', sans-serif; font-size: clamp(26px, 2.6vw, 34px); font-weight: 800;
    color: var(--brand-purple); line-height: 1.05;
}
.spg-total-val small { font-size: 0.6em; font-weight: 700; }
.spg-total-label {
    font-family: 'Noto Sans', sans-serif; font-size: 15px; color: #444;
    position: relative; padding-left: 26px; margin: 12px 0 0;
}
.spg-total-label::before { content: ""; position: absolute; top: 0.95em; left: 0; width: 18px; height: 3px; background: var(--brand-purple); }
.spg-cagr { font-family: 'Noto Sans', sans-serif; font-size: 15px; color: #444; margin: 12px 0 0; }
.spg-cagr .spg-tri { color: #2bb3a3; font-size: 11px; }
.spg-cagr b { color: #009fc7; font-size: 17px; }

/* Split label + body (Growth with Prudence / Solid Fundamentals) */
.spg-split { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: stretch; padding: 36px 0; border-top: 1px solid #e6e6e6; }
.spg-card { background: #eef6f3; border-radius: 12px; padding: 30px 32px; display: flex; flex-direction: column; justify-content: center; }
.spg-card-title { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; color: var(--brand-purple); line-height: 1.25; margin: 0; }
.spg-card-sub { font-family: 'Noto Sans', sans-serif; font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 14px 0 0; }
.spg-split-body { display: flex; flex-direction: column; justify-content: center; }
.spg-split-eyebrow { font-family: 'Noto Sans', sans-serif; font-size: 17px; color: #333; margin: 0 0 22px; }
.spg-mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.spg-fund-row2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px 30px; margin-bottom: 30px; }
.spg-fund-row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px 30px; }
.spg-mini-num {
    display: block;
    font-family: 'Noto Sans', sans-serif; font-size: clamp(24px, 2.4vw, 32px); font-weight: 800;
    color: #3a3a3a; line-height: 1.05;
}
.spg-mini p {
    font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.45; color: #555;
    position: relative; padding-left: 24px; margin: 8px 0 0;
}
.spg-mini p::before { content: ""; position: absolute; top: 0.9em; left: 0; width: 16px; height: 2px; background: var(--brand-purple); }
.spg-foot { font-family: 'Noto Sans', sans-serif; font-size: 12.5px; line-height: 1.6; color: #555; margin: 30px 0 0; }

/* Industry-Leading by Design — charts */
.spg-ilg { background: #fff; padding: 0 0 70px; }
.spg-ilg-title { margin-bottom: 36px; }
.ilg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 70px; }
.ilg-chart img { display: block; width: 100%; height: auto; }
.ilg-chart-title { font-family: 'Noto Sans', sans-serif; font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0 0 2px; }
.ilg-chart-title .ilg-unit { font-size: 13px; font-weight: 400; color: #888; }
.ilg-tag {
    display: inline-block; background: var(--brand-purple); color: #fff;
    font-family: 'Noto Sans', sans-serif; font-size: 12px; font-weight: 700;
    padding: 4px 12px; border-radius: 3px; margin: 9px 0 10px;
}
.ilg-bars { border-top: 1px solid #e0e0e0; }
.ilg-bar-row { display: grid; grid-template-columns: 78px 1fr auto; align-items: center; gap: 8px; padding: 4px 0; border-bottom: 1px solid #e0e0e0; }
.ilg-bar-label { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #333; }
.ilg-bar-track { display: block; height: 18px; }
.ilg-bar-fill { display: block; height: 100%; }
.ilg-ind { background: #5bc2e7; }
.ilg-comp { background: #a3d6bb; }
.ilg-bar-val { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #333; text-align: right; min-width: 46px; }
.ilg-data { width: 100%; border-collapse: collapse; margin-top: 12px; }
.ilg-data td { font-family: 'Noto Sans', sans-serif; font-size: 14px; padding: 6px 6px; border-bottom: 1px solid #e6e6e6; }
.ilg-data td:first-child { font-weight: 700; color: #1a1a1a; width: 33%; }
.ilg-data .ilg-c-ind { color: #009fc7; font-weight: 600; }
.ilg-data .ilg-c-comp { color: #5bab86; font-weight: 600; }
/* ============================================================
   FULLSCREEN MEGA MENU (copied from DAR reference)
   Opens from the existing Menu button; hamburger -> cross.
   ============================================================ */
.menu {
    position: fixed; inset: 0; z-index: 900; background: #fbfafc;
    clip-path: circle(0% at calc(100% - 48px) 42px);
    transition: clip-path .65s cubic-bezier(.22,.61,.36,1);
    display: flex; flex-direction: column; justify-content: flex-start;
    padding: 140px 0 clamp(28px,5vh,56px); overflow-y: auto;
}
/* Inner container aligns the menu's left/right edges with the header */
.menu > .container { width: 100%; }
.menu.open { clip-path: circle(150% at calc(100% - 48px) 42px); }
.menu-search { max-width: 520px; margin-bottom: clamp(18px,2.6vh,32px); display:none; }
.menu-search form { display: flex; align-items: center; gap: 10px; border-bottom: 2px solid #012a3f; padding-bottom: 10px; }
.menu-search input { flex: 1; border: none; outline: none; background: transparent; font-family: 'Noto Sans', sans-serif; font-size: 18px; color: #1b2127; }
.menu-search button { background: none; border: none; cursor: pointer; color: #012a3f; display: flex; }
.menu-search button svg { width: 20px; height: 20px; }
.menu-inner { width: 100%; max-width: 1340px; }
.mega {
    display: grid; grid-template-columns: 0.8fr 1.5fr; gap: clamp(28px,4vw,60px); align-items: stretch;
    opacity: 0; transform: translateY(18px);
}
.menu.open .mega { opacity: 1; transform: translateY(0); transition: opacity .55s cubic-bezier(.22,.61,.36,1) .14s, transform .55s cubic-bezier(.22,.61,.36,1) .14s; }
.mega-nav { display: flex; flex-direction: column; gap: 2px; border-right: 1px solid #e4e7ea; padding-right: clamp(14px,2vw,30px); }
.mega-tab {
    text-align: left; background: none; border: none; cursor: pointer; font-family: 'Playfair Display', serif;
    font-size: clamp(19px,1.9vw,28px); font-weight: 400; color: #1b2127; letter-spacing: -.01em; line-height: 1.18;
    padding: 10px 0; display: flex; align-items: baseline; gap: 13px; transition: color .25s, padding-left .25s;
}
.mega-tab .ix { font-family: 'Noto Sans', sans-serif; font-size: 12px; color: #5b6770; font-weight: 700; transition: color .25s; }
.mega-tab:hover, .mega-tab.active { color: var(--brand-purple); padding-left: 8px; }
.mega-tab:hover .ix, .mega-tab.active .ix { color: var(--brand-purple); }
.mega-panels { position: relative; min-height: 340px; }
.mega-panel {
    position: absolute; inset: 0; display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(22px,2.6vw,42px);
    opacity: 0; visibility: hidden; transform: translateY(10px);
    transition: opacity .45s cubic-bezier(.22,.61,.36,1), transform .45s cubic-bezier(.22,.61,.36,1), visibility .45s;
}
.mega-panel.active { position: relative; opacity: 1; visibility: visible; transform: translateY(0); }
.mega-subs { list-style: none; columns: 1; column-gap: 30px; align-self: center; margin: 0; padding: 0; }
.mega-subs.two { columns: 2; }
.mega-subs li { break-inside: avoid; margin-bottom: 11px; }
.mega-subs li a { font-size: 13.5px; color: #5b6770; line-height: 1.35; transition: color .2s, padding-left .2s; display: inline-block; }
.mega-subs li a:hover { color: var(--brand-purple); padding-left: 5px; }
.mega-figure {
    border-radius: 8px; overflow: hidden; min-height: 320px; position: relative;
    background-size: cover; background-position: center;
    background-image: linear-gradient(150deg, rgba(1,42,63,.55), rgba(138,43,140,.5)), var(--img, none);
    background-color: #0a2335;
}
/* --img must be declared HERE, not in an inline style: a relative url() inside a
   custom property resolves against this stylesheet's folder (css/), so an inline
   "images/menu/x.jpg" would 404 as "css/images/menu/x.jpg". Hence the ../ paths. */
#m-accelerating .mega-figure { --img: url(../images/menu/placeholder.jpg); }
#m-portfolio .mega-figure { --img: url(../images/menu/portfolio-overview-img.jpg); }
#m-corporate .mega-figure { --img: url(../images/menu/corporate-overview-img.jpg); }
#m-strategic .mega-figure { --img: url(../images/menu/strategic-review-img.jpg); }
#m-esg       .mega-figure { --img: url(../images/menu/esg-img.jpg); }
#m-statutory .mega-figure { --img: url(../images/menu/placeholder.jpg); }
#m-financial .mega-figure { --img: url(../images/menu/placeholder.jpg); }
.mega-figure .cap {
    position: absolute; left: 20px; bottom: 18px; right: 20px; color: #fff; font-family: 'Playfair Display', serif;
    font-size: clamp(17px,1.4vw,21px); line-height: 1.2; text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
@media (max-width: 860px) {
    .menu { padding-top: 96px; }
    /* Accordion: JS moves each panel directly under its tab inside .mega-nav */
    .mega { display: block; }
    .mega-nav { border-right: none; padding-right: 0; gap: 0; }
    .mega-panels { display: none; }                 /* emptied on mobile */
    .mega-tab { border-bottom: 1px solid #e4e7ea; width: 100%; padding: 15px 0; display: flex; align-items: center; }
    .mega-tab::after { content: '+'; margin-left: auto; font-size: 24px; font-weight: 400; line-height: 1; color: var(--brand-purple); }
    .mega-tab.active::after { content: '\2212'; }   /* minus when open */
    /* smooth expand/collapse */
    .mega-panel {
        position: relative; display: block; visibility: visible; transform: none;
        max-height: 0; overflow: hidden; opacity: 0; padding: 0;
        transition: max-height .4s ease, opacity .35s ease, padding .4s ease;
    }
    .mega-panel.active { max-height: 1000px; opacity: 1; padding: 2px 0 16px; }
    .mega-figure { display: none; }                 /* remove image on mobile */
    .mega-subs, .mega-subs.two { columns: 1; }
    .mega-subs li { margin-bottom: 13px; }
}
/* hamburger -> cross on the existing Menu button */
.menu-btn .hamburger span { transition: transform .3s cubic-bezier(.22,.61,.36,1), opacity .2s; }
.menu-btn.is-open .hamburger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-btn.is-open .hamburger span:nth-child(2) { opacity: 0; }
.menu-btn.is-open .hamburger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ============================================================
   INNER PAGE — Accelerating Infrastructure, Leveraging Intelligence
   ============================================================ */
/* Page-wide gradient background (bottom #b7f1ff -> top #fff) */
.ail-page { background: linear-gradient(to top, #b7f1ff 0%, #ffffff 65%); }
.ail-hero, .ail-content { background: transparent; }
.ail-hero { padding: 130px 0 40px; }
.ail-label {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 22px;
}
/* Two-column: heading + lead (left) | image placeholder (right) */
.ail-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}
.ail-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(26px, 4vw, 40px);
    font-weight: 700;
    line-height: 1.12;
    color: var(--brand-purple);
    margin: 0 0 20px;
    border-bottom: 2px solid #8e278f;
    padding-bottom: 20px;
}
.ail-hero-grid p 
{
    padding-bottom: 20px;
}
.ail-lead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px;
    line-height: 1.7;
    font-weight: 600;
    color: var(--brand-blue);
    margin: 0;
}
.ail-hero-media { border-radius: 14px; overflow: hidden; }
.ail-img-placeholder {
    width: 100%;
    aspect-ratio: 4 / 3;
    background: #eef0f3;
    border: 1px dashed #c4cad2;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    color: #97a1ac;
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 600; letter-spacing: .3px;
}

/* Body content — single column */
.ail-content { background: transparent; padding: 10px 0 90px; }
.ail-body { max-width: 100%; }
.ail-body > p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    line-height: 1.8;
    color: #444;
    margin: 0 0 22px;
}

/* Profile / caption card */
.ail-profile {
    border: 1px solid #8e278f;
    border-radius: 14px;
    padding: 26px 30px;
    margin-top: 14px;
}
.ail-profile-name {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 700;
    color: #444;
    margin: 0 0 8px;
}
.ail-profile-role {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.6; color: #444;
    margin: 0 0 14px; padding-bottom: 14px;
    border-bottom: 1px solid #444;
}
.ail-profile-bio {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; line-height: 1.7; color: #444;
    margin: 0;
}

/* ============================================================
   INNER PAGE — A Decade of Impact (pages 2-3)
   Palette: AGEL green. Reusable image placeholders via .img-ph
   ============================================================ */
.decade-page {
    --dec-green:   #1a8055;   /* dark green panel */
    --dec-teal:    #2f9c6a;   /* accent / section headings */
    --dec-box-bg:  #ecebe1;   /* light greige callout boxes */
    --dec-box-bar: #8faa4e;   /* olive left border on grid boxes */
}

/* Reusable image placeholder (leave in until design supplies assets) */
.img-ph {
    width: 100%;
    background: #eef0f3;
    border: 1px dashed #c4cad2;
    border-radius: 14px;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center; padding: 20px;
    color: #97a1ac;
    font-family: 'Noto Sans', sans-serif;
}
.img-ph-tag  { font-size: 15px; font-weight: 700; letter-spacing: .3px; color: #7c8894; }
.img-ph-dims { font-size: 13px; font-weight: 600; margin-top: 6px; color: #aab2bc; }

/* ---- Chapter-opener hero: title + intro | photo.
     Matches the environment/people pattern; scoped to .decade-page so the
     shared .syn-hero/.green-hero bases are not affected on other pages. ---- */
/* padding-bottom keeps the photo + its caption off the bottom edge of the mint band
   (the shared .syn-hero base has none, which left the caption sitting flush). */
.decade-page .syn-hero.green-hero { background: #e4efec; padding-top: 130px; padding-bottom: 40px; }
.decade-page .green-hero .syn-hero-title { color: var(--dec-green); }
.decade-page .green-hero .syn-hero-row {
    grid-template-columns: 1fr 1.3fr;
    gap: 40px; align-items: center; min-height: 0;
}
.decade-page .green-hero .syn-hero-text { padding: 10px 0 46px; }
/* position:relative anchors the overlaid caption (base .syn-hero-img is already
   relative; the img itself is forced static so it stays in normal flow). */
.decade-page .green-hero .syn-hero-img { position: relative; overflow: visible; align-self: center; }
.decade-page .green-hero .syn-hero-img img { position: static; width: 100%; height: auto; object-fit: contain; display: block; }

.dec-lead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 19px; line-height: 1.5; font-weight: 400;
    color: #333; margin: 0;
}
/* White caption band overlaid on a photo's bottom-left.
   .figcap-band is the REUSABLE version — drop it inside any image wrapper that is
   position:relative (the .syn-hero-img base already is; .inv-hero-img is set below).
   .dec-caption is a-decade-of-impact's instance of the same thing. */
.dec-caption,
.figcap-band {
    position: absolute; left: 0; bottom: 0; z-index: 2;
    display: inline-flex; align-items: center; gap: 10px;
    max-width: 100%; box-sizing: border-box;
    background: #fff; padding: 9px 16px; margin: 0;
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; font-weight: 600; line-height: 1.35; color: #333;
}
/* ── Photo-caption marker (SITE-WIDE — single source of truth) ─────────────
   Two stacked bars: a short one above a longer one. Every photo caption on the
   site uses this; override the colour per page with --figcap-bar. Painted as
   two gradients on ONE pseudo-element because a ::after would render after the
   text in these flex rows. */
.dec-caption::before,
.figcap-band::before,
.nrc-endimage-cap::before,
.acc-figcap::before,
.bmv-out-cap::before,
.esa-photo-cap::before,
.env-figcap::before {
    content: ""; flex: none;
    width: 22px; height: 8px;   /* 3px bar + 2px gap + 3px bar */
    background-image: linear-gradient(var(--figcap-bar, #2f9c6a), var(--figcap-bar, #2f9c6a)),
                      linear-gradient(var(--figcap-bar, #2f9c6a), var(--figcap-bar, #2f9c6a));
    background-size: 12px 3px, 22px 3px;
    background-position: left top, left bottom;
    background-repeat: no-repeat;
}
.env-figcap { --figcap-bar: #159E7A; }   /* environment / OHS / RSC use their own green */

/* ---- Intro copy, below the banner ----
   The lead in the hero and these paragraphs are one continuous piece of prose,
   so this reads as a modest continuation gap rather than a full section break. */
.dec-intro { padding: 30px 0 0; }
.dec-intro-copy { max-width: 980px; }
.dec-panel-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; line-height: 1.7; color: #333;
    margin: 0 0 18px;
}
.dec-panel-body:last-child { margin-bottom: 0; }

/* ---- A New Era of Energy is Rising ---- */
/* Single-column body copy — no multi-column paragraph layouts anywhere */
.dec-newera { padding: 60px 0 20px; }
.dec-sec-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(24px, 2.4vw, 30px);
    font-weight: 700; color: var(--dec-teal);
    line-height: 1.2; margin: 0 0 22px;
}
.dec-two-col p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444; margin: 0 0 22px;
}
.dec-two-col p:last-child { margin-bottom: 0; }

/* ---- At the Convergence of Speed, Scale and Intelligence ---- */
.dec-conv { padding: 40px 0 20px; }
.dec-conv-lead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.7; color: #444;
    max-width: 900px; margin: 0 0 34px;
}
.dec-sublead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 600; color: #1a1a1a; margin: 0 0 20px;
}
.dec-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
}
.dec-grid-box {
    background: var(--dec-box-bg);
    border-bottom: 4px solid var(--dec-box-bar);
    padding: 20px 22px;
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; line-height: 1.6; color: #333;
}

/* ---- Closing highlight box ---- */
.dec-highlight { padding: 40px 0 90px; }
.dec-highlight-box {
    background: #dde4cf;                 /* soft sage-green panel */
    padding: 46px 50px;
    border-radius: 4px;
}
.dec-highlight-box p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    font-weight: 700; line-height: 1.7;
    margin: 0 0 22px;
    /* Single flat green (the page's accent token). Previously a teal->leaf-green
       gradient text fill; background-clip/text-fill-color must stay removed or
       the text renders transparent. */
    color: var(--dec-teal);
}
.dec-highlight-box p:last-child { margin-bottom: 0; }

/* ============================================================
   INNER PAGE — Top-class Performance Delivered (pages 4-5)
   Reuses the .syn-hero banner (standard inner-page banner)
   ============================================================ */
.perf-page { --perf-green: #2f9c6a; }

/* ---- Reusable inner-page banner (AGEL green title on a clean ground) ----
   Applied via .green-hero on the .syn-hero <section>. Used on every inner
   page from Key Highlights onward. */
.green-hero { background: #fff; }
.green-hero .syn-hero-title { color: #2f9c6a; }
.green-hero .syn-hero-row { grid-template-columns: 1fr 1fr; min-height: 420px; }
.green-hero .syn-hero-img { border-radius: 0; overflow: hidden; }
.green-hero .syn-hero-img .img-ph { position: absolute; inset: 0; height: 100%; border-radius: 0; }

/* Section scaffolding */
.perf-section { padding: 26px 0; }
.perf-section:first-of-type { padding-top: 34px; }
.perf-section:last-of-type { padding-bottom: 90px; }
.perf-chip {
    display: inline-block;
    border: 1.5px solid var(--perf-green);
    color: var(--perf-green);
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; font-weight: 700; letter-spacing: .2px;
    padding: 7px 16px; border-radius: 0; margin-bottom: 30px;
}

/* Metric grid */
.perf-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 34px 26px; }
.perf-grid--3 { grid-template-columns: repeat(3, 1fr); }
.perf-metric { align-self: start; }
.perf-num {
    display: block;
    font-family: 'Noto Sans', sans-serif;
    font-size: clamp(26px, 2.6vw, 34px);
    font-weight: 800; line-height: 38px; color: var(--perf-green);
    /* integer line-height keeps every caption on a whole pixel so the
       leading dash renders at a uniform thickness across all cards */
}
.perf-unit { font-size: 16px; font-weight: 700; }
.perf-metric p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; line-height: 1.5; color: #444;
    margin: 12px 0 0; padding-left: 26px; position: relative;
}
/* leading dash to the LEFT of the caption, bottom-aligned to the first line */
.perf-metric p::before {
    content: ""; position: absolute; top: 12px; left: 0;
    width: 18px; height: 3px; border-radius: 0; background: #6A8F3C;
}
.perf-metric p.perf-xref { padding-left: 26px; }
.perf-metric p.perf-xref::before { display: none; }
.perf-tri { color: var(--perf-green); font-size: 10px; }
.perf-metric ul { margin: 8px 0 0 26px; padding-left: 18px; }
.perf-metric ul li { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #444; margin-bottom: 6px; }
.perf-metric ul li::marker { color: #A5B374; }
.perf-metric ul li:last-child { margin-bottom: 0; }
.perf-xref { margin-top: 10px; font-size: 14px; line-height: 1.5; color: #444; }
.perf-xref .perf-arrow { color: var(--perf-green); font-weight: 700; }
.perf-xref b { color: var(--perf-green); }

/* Sub-group heading with rule (Capacity Utilisation Factor / Plant Availability) */
.perf-subhead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; font-weight: 700; color: #1a1a1a;
    margin: 30px 0 22px; padding-bottom: 9px;
    border-bottom: 1px solid #dcdcdc;
}

/* ============================================================
   INNER PAGE — A National Record in Capacity Creation (pages 6-9)
   Reuses .green-hero banner + .perf-grid / .perf-metric cards
   ============================================================ */
.nrc-page { --nrc-green: #2f9c6a; --perf-green: #2f9c6a; }

.nrc-section { padding: 30px 0; }
.nrc-section:last-of-type { padding-bottom: 90px; }

/* Section + sub headings */
.nrc-h {
    font-family: 'Noto Sans', sans-serif;
    font-weight: 700; font-size: 20px; line-height: 1.25;
    margin: 0 0 16px;
}
.nrc-h--green { color: var(--nrc-green); }
.nrc-h--dark  { color: #1a1a1a; }

/* Green lead paragraph (highlight copy) */
.nrc-lead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; line-height: 1.6; font-weight: 600;
    color: var(--nrc-green); margin: 0 0 32px;
}
/* Body copy — single column, full container width */
.nrc-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; line-height: 1.7; color: #444;
    margin: 0 0 18px;
}
.nrc-body:last-child { margin-bottom: 0; }

/* Chart / table placeholders */
.nrc-chart-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.nrc-chart { margin-bottom: 30px; }
.nrc-chart-title {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0 0 2px;
}
.nrc-chart-unit { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #666; margin: 0 0 16px; }
.nrc-chart-ph { min-height: 170px; border-radius: 0; }

/* Highlights of Our Milestone box — soft halo glow */
.nrc-highlights {
    border: 1px solid #cdd7bf; background: #fff;
    padding: 26px 30px; margin-top: 30px; max-width: 560px;
    box-shadow: 0 0 42px 4px rgba(106, 143, 60, 0.30), 0 6px 22px rgba(0, 0, 0, 0.06);
}
.nrc-highlights-title {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0 0 16px;
}
.nrc-highlights ul { margin: 0; padding-left: 20px; }
.nrc-highlights li {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; line-height: 1.55; color: #444; margin-bottom: 12px;
}
.nrc-highlights li::marker { color: #A5B374; }
.nrc-highlights li:last-child { margin-bottom: 0; }

/* Scaling at Speed */
.nrc-scale { display: flex; flex-wrap: wrap; gap: 26px 30px; }
.nrc-scale-item { flex: 1; min-width: 200px; }
.nrc-scale-head {
    font-family: 'Noto Sans', sans-serif; color: var(--nrc-green);
    line-height: 1.05; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.nrc-scale-label { font-size: 16px; font-weight: 700; }
.nrc-scale-num   { font-size: clamp(28px, 3vw, 38px); font-weight: 800; }
.nrc-scale-unit  { font-size: 16px; font-weight: 700; }
.nrc-scale-arrow { color: var(--nrc-green); font-size: 22px; font-weight: 700; }
.nrc-scale-item > p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px; line-height: 1.5; color: #444;
    margin: 12px 0 0; padding-left: 26px; position: relative;
}
.nrc-scale-item > p::before {
    content: ""; position: absolute; top: 12px; left: 0;
    width: 18px; height: 3px; background: #6A8F3C;
}

/* Closing full-bleed image (Bhadla, Rajasthan) */
.nrc-endimage { position: relative; }
.nrc-endimage-ph { width: 100%; min-height: 480px; border-radius: 0; }
.nrc-endimage-capwrap { position: absolute; bottom: 20px; left: 0; right: 0; pointer-events: none; }
.nrc-endimage-cap {
    float: right; background: #fff;
    display: inline-flex; align-items: center; gap: 10px;
    padding: 9px 16px;
    font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333;
}
/* marker: see the site-wide photo-caption marker rule */

/* ============================================================
   INNER PAGE — Key Performance Indicators (pages 96-99)
   Reuses .green-hero (title-only) + .nrc-chart / .nrc-endimage
   ============================================================ */
.kpi-grouphead { margin-top: 10px; }
.kpi-notes { border-top: 1px solid #d8ddcd; margin-top: 24px; padding-top: 20px; }
.kpi-notes-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 10px; }
.kpi-notes ol { margin: 0; padding-left: 20px; }
.kpi-notes li { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.6; color: #444; margin: 0 0 8px; }
.kpi-notes li:last-child { margin-bottom: 0; }

/* ============================================================
   INNER PAGE — Electricity Generation at Grid Scale (pages 10-13)
   Reuses .green-hero banner + .nrc-chart / .nrc-endimage placeholders
   ============================================================ */
.acc-page { --acc-green: #2f9c6a; --acc-teal: #1a9e8e; }

.acc-section { padding: 30px 0; }

.acc-lead {
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px; line-height: 1.6; font-weight: 600;
    color: var(--acc-green); margin: 0 0 30px;
}
.acc-h {
    font-family: 'Noto Sans', sans-serif;
    font-weight: 700; font-size: 20px; line-height: 1.25; margin: 0 0 16px;
}
.acc-h--green { color: var(--acc-green); }
.acc-h--dark  { color: #1a1a1a; }
.acc-body {
    font-family: 'Noto Sans', sans-serif;
    font-size: 15px; line-height: 1.7; color: #444; margin: 0 0 18px;
}
.acc-body:last-child { margin-bottom: 0; }

/* Green-bordered callout box (37,567 million units / 91.2% EBITDA) — halo glow */
.acc-box {
    border: 1.5px solid #7aa03f; background: #fff;
    padding: 24px 28px; max-width: 360px;
    box-shadow: 0 0 42px 4px rgba(106, 143, 60, 0.30), 0 6px 22px rgba(0, 0, 0, 0.06);
}
.acc-box-num {
    display: block; font-family: 'Noto Sans', sans-serif;
    font-weight: 800; font-size: clamp(28px, 3vw, 34px);
    line-height: 38px; color: var(--acc-teal);
}
.acc-box-unit { font-size: 16px; font-weight: 700; }
.acc-box-note {
    font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5;
    color: var(--acc-teal); margin: 8px 0 0; padding-left: 26px; position: relative;
}
.acc-box-note::before {
    content: ""; position: absolute; top: 12px; left: 0;
    width: 18px; height: 3px; background: #6A8F3C;
}
.acc-box-big {
    font-family: 'Noto Sans', sans-serif; font-weight: 800;
    font-size: 20px; line-height: 1.35; color: var(--acc-teal); margin: 22px 0 0;
}

/* Soft green callout box (pull-out highlight) */
.acc-callout {
    background: #eef4ea; border: 1px solid #cfe0c6;
    padding: 22px 26px; margin: 4px 0 24px;
    font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7;
    font-weight: 600; color: var(--acc-green);
}
.acc-callout p { margin: 0; }

/* Right-aligned figure caption (green rule + label) */
.acc-figcap {
    display: inline-flex; align-items: center; gap: 10px; float: right;
    font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333; margin: 0;
}
/* marker: see the site-wide photo-caption marker rule */

/* Bullet list with olive square markers */
.acc-list { list-style: none; margin: 0; padding: 0; }
.acc-list li {
    position: relative; padding-left: 22px; margin-bottom: 12px;
    font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.6; color: #444;
}
.acc-list li::before {
    content: ""; position: absolute; left: 0; top: 8px;
    width: 8px; height: 8px; background: #A5B374;
}
.acc-list li:last-child { margin-bottom: 0; }

/* CUF chart + EBITDA box row */
.acc-cuf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }

/* ============================================================
   INNER PAGE — The 30 GW Khavda RE Project (pages 14-17)
   Reuses .green-hero, .perf-metric (teal), .acc-* headings/lists,
   .nrc-chart placeholders
   ============================================================ */
.khv-page {
    --acc-green: #1a9e8e; --acc-teal: #1a9e8e;
    --perf-green: #1a9e8e; --khv-green: #2f9c6a;
}
.khv-section { padding: 30px 0; }

/* 4-category content table (label cell + bullets) */
.khv-table { margin-top: 8px; }
.khv-table-row {
    display: grid; grid-template-columns: 210px 1fr;
    border: 1px solid #e2e6d9; margin-bottom: 14px;
}
.khv-table-label {
    background: #eef2e5; padding: 20px 22px;
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a;
    display: flex; align-items: center;
}
.khv-table-cell { padding: 18px 24px; }

/* Arid land block (solar / wind sub-metrics) */
.khv-arid-title {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 20px;
    color: var(--acc-teal); text-align: center; margin: 36px 0 24px; line-height: 1.3;
}
.khv-arid-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; max-width: 760px; margin: 0 auto; }
.khv-arid-item { display: flex; gap: 16px; align-items: center; }
.khv-arid-icon { width: 96px; min-height: 70px; flex: none; }
.khv-arid-item p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #333; margin: 0; }
.khv-arid-item p.khv-arid-val { color: #000; font-weight: 700; }
.khv-map-note { font-family: 'Noto Sans', sans-serif; font-size: 12px; color: #888; text-align: right; margin-top: 12px; }

/* ============================================================
   INNER PAGE — Building an AI-first Organisation (pages 20-21)
   Reuses .green-hero + .acc-* headings/lead/body/list
   ============================================================ */
.ai-page {
    --ai-green: #2f9c6a; --acc-green: #2f9c6a; --acc-teal: #2f9c6a; --perf-green: #2f9c6a;
}
.ai-section { padding: 30px 0; }

/* "How We are Embedding AI" — 2x2 value-chain boxes */
.ai-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 8px; align-items: stretch; }
.ai-box { border: 1px solid #cdd7bf; display: flex; flex-direction: column; height: 100%; }
.ai-box-head { background: #eef1ea; padding: 18px 22px; }
.ai-box-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #1a1a1a; margin: 0; }
.ai-box-sub   { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: var(--ai-green); margin: 2px 0 0; }
.ai-box-body  { padding: 20px 22px; display: flex; flex-direction: column; flex: 1; }
.ai-box-body .acc-list { flex: 1 0 auto; }
.ai-delivers  { border: 1px solid #cdd7bf; padding: 16px 18px; margin-top: 18px; }
.ai-delivers-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 8px; }
.ai-delivers-text  { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #1a1a1a; margin: 0; }

/* ============================================================
   INNER PAGE — Approach to Integrated Reporting (page 24-25)
   Title-only banner (no photo in source); icon placeholders
   ============================================================ */
.rep-page { --rep-blue: #00aeef; --rep-teal: #178b7f; --rep-green: #2f9c6a; }
.rep-section { padding: 26px 0; }
.rep-h {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px;
    color: var(--rep-green); margin: 0 0 14px;
}
.rep-intro-lead {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px;
    line-height: 1.7; color: #1a1a1a; margin: 0 0 18px;
}
.rep-body {
    font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7;
    color: #444; margin: 0 0 16px;
}
.rep-body:last-child { margin-bottom: 0; }
.rep-def { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7; color: #444; margin: 0 0 14px; }
.rep-def b { color: #1a1a1a; }

/* Navigating through Our Report — Our Capitals on tinted band, rest on white */
.rep-nav { background: #fff; padding: 0 0 54px; }
.rep-nav-top { background: #edefe6; padding: 44px 0 40px; margin-bottom: 40px; }
.rep-nav-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 22px; color: var(--rep-green); margin: 0 0 26px; }
.rep-block { margin-bottom: 34px; }
.rep-block:last-child { margin-bottom: 0; }

/* Coloured label bars */
.rep-label {
    display: inline-block; color: #fff;
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px;
    padding: 8px 20px; margin-bottom: 22px;
}
.rep-label--blue { background: var(--rep-blue); }
.rep-label--teal { background: var(--rep-blue); }   /* all label bars use the blue */

/* Icon rows (Capitals / Stakeholders) */
.rep-cap-grid   { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 24px; }
.rep-stake-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 24px; }
.rep-icon-item  { display: flex; align-items: center; gap: 14px; }
.rep-icon-ph {
    width: 48px; height: 48px; flex: none;
    border: 1px dashed #b7c0b0; background: #e4e8dc;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Noto Sans', sans-serif; font-size: 9px; font-weight: 700;
    color: #8a9584; letter-spacing: .5px;
}
.rep-icon-name {
    font-family: 'Noto Sans', sans-serif; font-size: 15px; font-weight: 600;
    color: var(--rep-teal); line-height: 1.3;
}

/* Code badges (Material Topics / Risks / Strategies) */
.rep-badge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 22px; }
.rep-strat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 22px; }
.rep-badge-item { display: flex; align-items: center; gap: 14px; }
/* corner-bracket badge (border-right + border-bottom), colour per category */
.rep-badge {
    flex: none; min-width: 56px; height: 48px; padding: 0 10px;
    display: flex; align-items: center; justify-content: center;
    background: transparent;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    font-family: 'Noto Sans', sans-serif; font-size: 16px; font-weight: 800;
}
.rep-badge--m { color: #009540; }   /* Material Topics — green */
.rep-badge--r { color: #7fb0a6; }   /* Risk — muted teal-grey */
.rep-badge--s { color: #6f8f3f; }   /* Strategies — olive */
.rep-badge-txt {
    font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.35; color: #333;
    align-self: center;
}

/* ============================================================
   INNER PAGE — Message from the Chairman (pages 46-51)
   Reuses .green-hero banner (real portrait image)
   ============================================================ */
.chair-page { --chair-green: #2f9c6a; --chair-teal: #178b7f; --chair-sage: #6f9068; }
.chair-section { padding: 30px 0 90px; }
.chair-greeting {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 17px;
    color: var(--chair-green); margin: 0 0 18px;
}
.chair-body {
    font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.8;
    color: #444; margin: 0 0 16px;
}

/* Pull quote — grey variant (opening, full width; green rule after the quote) */
.chair-quote--grey { margin: 36px 0; }
.chair-quote--grey p {
    font-family: 'Noto Sans', sans-serif; font-weight: 700;
    font-size: clamp(18px, 1.9vw, 23px); line-height: 1.4; color: #8a8a8a; margin: 0 0 18px;
}
.chair-quote-rule { display: block; width: 64px; height: 3px; background: #8faa4e; margin: 0 0 14px; }
.chair-quote--grey cite { font-family: 'Noto Sans', sans-serif; font-style: normal; font-size: 14px; color: #666; }

/* Pull quote — green variant (quote-icon placeholder) */
.chair-quote--green { margin: 40px 0; }
.chair-quote-ph {
    margin-bottom: 18px;
}
.chair-quote--green p {
    font-family: 'Noto Sans', sans-serif; font-weight: 700;
    font-size: clamp(20px, 2.2vw, 27px); line-height: 1.4; color: var(--chair-sage); margin: 0;
}

/* Stat callouts */
.chair-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 40px; margin: 34px 0; }
.chair-stat-num {
    font-family: 'Noto Sans', sans-serif; font-weight: 800;
    font-size: clamp(30px, 4vw, 44px); line-height: 1; color: var(--chair-teal);
}
.chair-stat-num small { font-size: 20px; font-weight: 800; }
.chair-stat-label {
    font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #333;
    margin: 12px 0 0; padding-left: 26px; position: relative;
}
.chair-stat-label::before {
    content: ""; position: absolute; top: 10px; left: 0;
    width: 18px; height: 3px; background: #6A8F3C;
}
.chair-signoff { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.8; color: #444; margin: 22px 0 0; }
.chair-signoff b { color: var(--chair-green); }

/* Tight stanza — grouped short lines with no paragraph gap */
.chair-stanza { margin: 0 0 16px; }
.chair-stanza .chair-body { margin-bottom: 3px; }
.chair-stanza .chair-body:last-child { margin-bottom: 0; }

/* Section heading within the letter (green) */
.chair-h {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px;
    color: var(--chair-green); margin: 32px 0 14px; line-height: 1.25;
}
/* cite role line (lighter) */
.chair-quote--grey cite { line-height: 1.5; }
.chair-quote--grey cite .role { color: #999; }

/* MD & CEO banner — two portrait placeholders */
.mdceo-portraits { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: center; align-self: center; }
/* Sources are landscape headshots (748x480) with the subject centred; cover-cropping
   to 3/4 keeps full head-to-chest height and trims only blurred side background. */
.mdceo-portrait { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center; display: block; border-radius: 0; }

/* ============================================================
   INNER PAGE — About Adani Green Energy Limited (pages 56-57)
   Reuses .green-hero (title-only), .acc-* text, .nrc-endimage
   ============================================================ */
.abt-page { --acc-green: #2f9c6a; --acc-teal: #2f9c6a; }
.abt-section { padding: 30px 0; }

/* Our Reputation box — single column, elevated 3D card */
.abt-repbox {
    border: 1px solid #cdd7bf; background: #fff;
    padding: 28px 32px; margin-top: 30px; max-width: 560px;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.14), 0 3px 8px rgba(0, 0, 0, 0.06);
}
.abt-repbox-title {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 17px;
    color: var(--acc-green); margin: 0 0 20px;
}
.abt-repbox-list { list-style: none; margin: 0; padding: 0; }
.abt-repbox-list li {
    font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #444;
    margin-bottom: 16px;
}
.abt-repbox-list li:last-child { margin-bottom: 0; }

/* ============================================================
   INNER PAGE — Investment Case (pages 58-59)
   ============================================================ */
.inv-page { --inv-green: #1a8055; --inv-teal: #178b7f; --inv-teal-lt: #2b9e8e; }

/* Banner: eyebrow + dark title + green lead panel (left), image (right) */
.inv-hero { padding: 120px 0 0; }
.inv-hero-row { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: stretch; }
.inv-hero-text { display: flex; flex-direction: column; justify-content: center; }
.inv-hero-img { display: flex; position: relative; overflow: hidden; }  /* position anchors .figcap-band */
.inv-hero-img .img-ph { flex: 1; min-height: 360px; border-radius: 0; }
.inv-hero-img .inv-hero-banner { flex: 1; min-width: 0; min-height: 360px; width: 100%; object-fit: cover; object-position: center; display: block; border-radius: 0; }

/* Full-width green lead band (below the banner) */
.inv-leadsec { padding: 34px 0 6px; }
.inv-eyebrow {
    display: block; font-family: 'Noto Sans', sans-serif;
    font-weight: 700; font-size: 18px; color: #1a1a1a; margin-bottom: 14px;
}
.inv-title {
    font-family: 'Playfair Display', serif; font-size: clamp(30px, 4vw, 46px);
    font-weight: 700; line-height: 1.12; color: #1a1a1a; margin: 0 0 26px;
}
.inv-lead-panel { background: var(--inv-green); padding: 42px 50px; }
.inv-lead-panel p {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 17px;
    line-height: 1.6; color: #fff; margin: 0;
}

/* Investment cases — stacked one after another, divided by a light rule */
.inv-section { padding: 40px 0 60px; }
.inv-case { padding-bottom: 26px; border-bottom: 1px solid #dcdcdc; margin-bottom: 26px; }
.inv-case:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
.inv-case-head { display: flex; align-items: stretch; margin-bottom: 16px; }
.inv-case-label {
    background: var(--inv-teal-lt); color: #fff; flex: none;
    display: flex; align-items: center; padding: 0 15px;
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px;
}
/* Title in a transparent box with green outline, top line missing */
.inv-case-title-wrap {
    flex: 1;
    border: 2px solid var(--inv-teal-lt);
    border-top: none;
    padding: 10px 16px;
    display: flex; align-items: center;
}
.inv-case-title {
    font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px;
    line-height: 1.2; color: #5faa78;   /* light green */
}
.inv-list { list-style: none; margin: 0; padding: 0; }
.inv-list li {
    position: relative; padding-left: 18px; margin-bottom: 12px;
    font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.5; color: #444;
}
.inv-list li::before {
    content: ""; position: absolute; left: 0; top: 6px;
    width: 7px; height: 7px; background: #A5B374;
}
.inv-list li:last-child { margin-bottom: 0; }

/* ============================================================
   INNER PAGE — Business Model / Value Creation Model (pp. 62-65)
   Accordion adaptation (single open). Icon placeholders.
   ============================================================ */
.bmv-section { background: #fff; padding: 40px 0 90px; }
.bmv-banner { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; margin-bottom: 40px; }
.bmv-banner .bmv-head-text { margin-bottom: 0; }
.bmv-banner-img { display: flex; }
.bmv-banner-img .img-ph { flex: 1; aspect-ratio: 3 / 2; border-radius: 0; }
.bmv-head-text { margin-bottom: 30px; }
.bmv-eyebrow { display: block; font-family: 'Noto Sans', sans-serif; font-size: 18px; font-weight: 700; color: #1a1a1a; margin-bottom: 12px; }
.bmv-title { font-family: 'Playfair Display', serif; font-size: clamp(30px, 4vw, 44px); line-height: 1.1; font-weight: 700; color: #2f9c6a; margin: 0; }

/* Accordion */
.bmv-acc { border-top: 1px solid #e2e4e8; }
.bmv-item { border-bottom: 1px solid #e2e4e8; }
.bmv-acc-head {
    width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px;
    background: linear-gradient(90deg, #1a9e8e 0%, #2f9c6a 100%);
    border: none; cursor: pointer; padding: 16px 20px; text-align: left; margin-bottom: 20px;
}
.bmv-acc-title { font-family: 'Playfair Display', serif; font-size: clamp(17px, 2vw, 21px); font-weight: 700; color: #fff; line-height: 1.25; }
.bmv-acc-ico { position: relative; width: 22px; height: 22px; flex: none; }
.bmv-acc-ico::before, .bmv-acc-ico::after { content: ""; position: absolute; background: #fff; }
.bmv-acc-ico::before { left: 0; top: 50%; width: 100%; height: 2px; transform: translateY(-50%); }
.bmv-acc-ico::after  { top: 0; left: 50%; width: 2px; height: 100%; transform: translateX(-50%); transition: opacity .3s ease; }
.bmv-item.is-open .bmv-acc-ico::after { opacity: 0; }

.bmv-panel { overflow: hidden; }
.bmv-panel-inner { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px 40px; padding: 6px 4px 36px; }

/* Capital / factor blocks */
.bmv-cap-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.bmv-cap-title { font-family: 'Noto Sans', sans-serif; font-size: 17px; font-weight: 700; color: #4EB9AB; margin: 0; line-height: 1.25; }
.bmv-list { list-style: none; margin: 0; padding: 0; }
.bmv-list li { position: relative; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #444; padding-left: 16px; margin-bottom: 6px; }
.bmv-list li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: #A5B374; }
.bmv-cap > .bmv-list { padding-left: 52px; }
.bmv-cols .bmv-cap > .bmv-list { padding-left: 0; }

/* Outputs */
.bmv-out-grid { grid-template-columns: 1fr 1fr; align-items: start; }
.bmv-out-figs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px 30px; }
.bmv-out-val { display: block; font-family: 'Noto Sans', sans-serif; font-size: clamp(26px, 3vw, 34px); font-weight: 800; color: #2f9c6a; line-height: 1.05; }
.bmv-out-val small { font-size: 16px; font-weight: 800; }
.bmv-out-fig p { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #444; margin: 10px 0 0; padding-left: 26px; position: relative; }
.bmv-out-fig p::before { content: ""; position: absolute; left: 0; top: 9px; width: 18px; height: 3px; background: #6A8F3C; }

/* Operating-model flow */
.bmv-flow { max-width: 560px; margin: 0 auto; }
.bmv-flow-step { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; }
.bmv-flow-step span { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #2f9c6a; }
.bmv-flow-arrow { text-align: center; color: #b0b0b0; font-size: 20px; margin: 10px 0; }
.bmv-flow-label { text-align: center; font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #666; margin: 18px 0 12px; }
.bmv-flow-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 4px 0; }
.bmv-flow-cell { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; font-family: 'Noto Sans', sans-serif; font-size: 13px; font-weight: 600; color: #333; }
.bmv-flow-hl { text-align: center; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 16px; color: #2f9c6a; margin: 20px 0; line-height: 1.35; }

/* Icon / image placeholders */
.bmv-ico-ph { flex: none; width: 40px; height: 40px; background: #eef0f3; border: 1px dashed #c4cad2; display: flex; align-items: center; justify-content: center; font-family: 'Noto Sans', sans-serif; font-size: 9px; font-weight: 700; color: #97a1ac; }
.bmv-img-ph { width: 100%; aspect-ratio: 4 / 3; background: #eef0f3; border: 1px dashed #c4cad2; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; padding: 16px; font-family: 'Noto Sans', sans-serif; font-size: 13px; font-weight: 600; color: #97a1ac; }
.bmv-flow-ph { aspect-ratio: auto; min-height: 620px; max-width: 560px; margin: 0 auto; }
.bmv-out-cap { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333; display: flex; align-items: center; gap: 10px; margin-top: 12px; }
/* marker: see the site-wide photo-caption marker rule */

/* ============================================================
   INNER PAGE — Stakeholder Engagement (pp. 66-71)
   ============================================================ */
.stk-page { --stk-green: #2f9c6a; --stk-teal: #178b7f; --acc-green: #2f9c6a; --acc-teal: #2f9c6a; }
.stk-section { padding: 30px 0; }
.stk-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 20px; color: var(--stk-green); margin: 0 0 8px; }
.stk-sub { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.6; color: #444; margin: 0 0 24px; }
.stk-list { list-style: none; margin: 0; padding: 0; }
.stk-list li { position: relative; padding-left: 16px; margin-bottom: 8px; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 21px; color: #444; }
.stk-list li::before { content: ""; position: absolute; left: 0; top: 7px; width: 7px; height: 7px; background: #A5B374; }
.stk-list li:last-child { margin-bottom: 0; }

/* Engagement mechanism — 4-step flow */
.stk-flow { display: flex; align-items: stretch; gap: 8px; }
.stk-flow-card { flex: 1; display: flex; flex-direction: column; }
.stk-flow-head { background: #2b9e8e; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; text-align: center; padding: 14px 10px; }
.stk-flow-body { flex: 1; background: #eef2e5; border-bottom: 3px solid #7aa03f; padding: 16px 15px; font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.5; color: #444; }
.stk-flow-arrow { align-self: center; color: #2b9e8e; font-size: 26px; font-weight: 700; flex: none; }

/* Governance mechanism */
.stk-gov-title { text-align: center; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #1a1a1a; margin: 0 0 24px; }
.stk-gov { display: grid; grid-template-columns: repeat(4, 1fr); gap: 34px; border-top: 2px solid var(--stk-green); padding-top: 24px; }
.stk-gov-item h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: var(--stk-teal); margin: 0 0 10px; line-height: 1.3; }
.stk-gov-item p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #444; margin: 0 0 10px; }
.stk-gov-item a { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #888; display: inline-flex; align-items: center; gap: 6px; }
.stk-gov-item a::before { content: "\2197"; color: var(--stk-teal); }

/* Importance matrix (chart placeholder) */
.stk-matrix-ph { width: 100%; min-height: 440px; }

/* Capitals + Material Topics legend */
.stk-legend { display: grid; grid-template-columns: 1fr 2fr; gap: 44px; }
.stk-legend-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; color: #1a1a1a; margin: 0 0 16px; }
.stk-caps-list { display: flex; flex-direction: column; gap: 12px; }
.stk-cap-row { display: flex; align-items: center; gap: 12px; font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333; }
.stk-topics-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; }
.stk-topic { display: flex; align-items: flex-start; gap: 10px; }
.stk-topic-txt { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.35; color: #333; align-self: center; }

/* Code badge (teal outline) */
.stk-badge { flex: none; min-width: 30px; height: 26px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid var(--stk-teal); color: var(--stk-teal); font-family: 'Noto Sans', sans-serif; font-size: 12px; font-weight: 700; }

/* Icon placeholders */
.stk-ico-ph { flex: none; width: 44px; height: 44px; background: #e4e8dc; border: 1px dashed #b7c0b0; display: flex; align-items: center; justify-content: center; font-family: 'Noto Sans', sans-serif; font-size: 9px; font-weight: 700; color: #8a9584; }
.stk-ico-ph--sm { width: 30px; height: 30px; font-size: 8px; }

/* Stakeholder cards — light-green border, green 3D reflective base */
.stk-cards { display: grid; grid-template-columns: 1fr; gap: 40px; }
.stk-card {
    background: #fff;
    border: 2px solid #bcd49a;
    border-bottom: 4px solid #2f9c6a;   /* whole-pixel borders keep stats on a consistent row */
    box-shadow: 0 14px 24px -8px rgba(47, 156, 106, 0.28);
    padding: 24px 26px;
}
.stk-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.stk-card-head .stk-ico-ph {
    background: #fff;
    border: 1px solid #d8e3c4;
    border-left: 3px solid #2f9c6a;
    border-bottom: 3px solid #2f9c6a;
}
.stk-card-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 19px; color: var(--stk-teal); margin: 0; line-height: 24px; }
.stk-card-title small { font-size: 14px; font-weight: 700; }
.stk-card-desc { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 22px; color: #444; margin: 0 0 18px; }
.stk-card-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.stk-colhead { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; line-height: 20px; color: #1a1a1a; margin: 0 0 10px; }
.stk-card-foot { border-top: 1px solid #e2e4e8; margin-top: 20px; padding-top: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.stk-stats { display: flex; flex-wrap: wrap; gap: 24px; }
/* integer line-height keeps each caption on a whole pixel -> uniform dash */
.stk-stat-num { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 24px; color: var(--stk-green); line-height: 30px; }
.stk-stat p { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 18px; color: #444; margin: 10px 0 0; padding-left: 26px; position: relative; }
.stk-stat p::before { content: ""; position: absolute; left: 0; top: 12px; width: 18px; height: 3px; background: #6A8F3C; }
.stk-themes { display: flex; flex-wrap: wrap; gap: 8px; }
.stk-caps-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.stk-foot-note { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #777; line-height: 1.6; margin: 30px 0 0; }

/* ============================================================
   INNER PAGE — Material Matters (pp. 72-81)
   ============================================================ */
.mm-page { --mm-green: #2f9c6a; --mm-teal: #17a294; --mm-blue: #2bb6d6; --mm-orange: #f07d1a; }
.mm-section { padding: 30px 0; }
.mm-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 20px; color: var(--mm-green); margin: 0 0 12px; }
.mm-body { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7; color: #444; margin: 0 0 16px; }
.mm-label { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; line-height: 20px; color: #1a1a1a; margin: 0 0 8px; }
.mm-list { list-style: none; margin: 0; padding: 0; }
.mm-list li { position: relative; padding-left: 16px; margin-bottom: 7px; font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 20px; color: #444; }
.mm-list li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: #A5B374; }

/* Impact / Financial materiality boxes (Approach) */
.mm-mat-boxes { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 24px 0; max-width: 780px; }
.mm-mat-box { background: #eef1f4; }
.mm-mat-box-head { background: var(--mm-teal); color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; padding: 11px 16px; }
.mm-mat-box p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #444; padding: 16px; margin: 0; }

/* E / S / G legend */
.mm-esg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }
.mm-esg-head { color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; padding: 9px 16px; }
.mm-esg-head--env { background: var(--mm-green); }
.mm-esg-head--soc { background: var(--mm-blue); }
.mm-esg-head--gov { background: var(--mm-orange); }
.mm-esg-item { display: flex; gap: 12px; align-items: flex-start; margin-top: 16px; }
.mm-esg-txt { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.35; color: #333; align-self: center; }

/* M badge (colour by pillar) */
.mm-badge { flex: none; min-width: 34px; height: 30px; padding: 0 7px; display: inline-flex; align-items: center; justify-content: center; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; color: #fff; }
.mm-badge--env { background: var(--mm-green); }
.mm-badge--soc { background: var(--mm-blue); }
.mm-badge--gov { background: var(--mm-orange); }

/* Matrix chart placeholder */
.mm-matrix-ph { width: 100%; min-height: 460px; }

/* Topic cards — single column, light border + green 3D reflective base */
.mm-cards { display: grid; grid-template-columns: 1fr; gap: 36px; }
.mm-card { background: #fff; border: 2px solid #bcd49a; border-bottom: 4px solid #2f9c6a; box-shadow: 0 14px 24px -8px rgba(47,156,106,.28); padding: 24px 26px; }
.mm-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #e2e4e8; }
.mm-card-head .mm-badge { min-width: 44px; height: 34px; font-size: 15px; background: var(--mm-green); }   /* all card badges green; pillar colour only in the legend */
.mm-card-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: var(--mm-green); margin: 0; }
.mm-card-top { display: grid; grid-template-columns: 0.9fr 1.4fr 1fr 1fr; gap: 26px; padding-bottom: 18px; border-bottom: 1px solid #e2e4e8; }
.mm-card-bottom { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 26px; padding-top: 18px; }
.mm-sbadges, .mm-mrow { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mm-sbadge { flex: none; min-width: 30px; height: 26px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid #6f8f3f; color: #6f8f3f; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 12px; }
.mm-tri-up   { color: var(--mm-green); font-size: 12px; }
.mm-tri-down { color: var(--mm-orange); font-size: 12px; }
.mm-risk, .mm-opp { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13.5px; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mm-risk { color: var(--mm-green); }
.mm-opp  { color: var(--mm-green); margin-top: 14px; }
.mm-sdg-ph { min-height: 40px; }
.mm-ico-ph { flex: none; width: 26px; height: 26px; background: #e4e8dc; border: 1px dashed #b7c0b0; display: inline-flex; align-items: center; justify-content: center; font-family: 'Noto Sans', sans-serif; font-size: 8px; font-weight: 700; color: #8a9584; }

/* Stakeholders / Strategy / Capitals legend */
.mm-legend { background: #e6f2ee; padding: 30px 32px; display: grid; grid-template-columns: 1fr 1.3fr 1fr; gap: 34px; }
.mm-legend-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 0 0 16px; }
.mm-legend-row { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; font-family: 'Noto Sans', sans-serif; font-size: 13.5px; color: #333; }
.mm-strat-row { display: flex; gap: 12px; margin-bottom: 12px; align-items: flex-start; }
.mm-strat-txt { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.4; color: #333; align-self: center; }
.mm-fin-impl { display: flex; gap: 24px; margin-top: 8px; font-family: 'Noto Sans', sans-serif; font-size: 13.5px; color: #333; }

/* ============================================================
   INNER PAGE — Risk and Opportunities (pp. 82-95)
   ============================================================ */
.rsk-page { --rsk-teal: #178b7f; --rsk-teal-lt: #2b9e8e; --acc-green: #2f9c6a; --acc-teal: #2f9c6a; }
.rsk-section { padding: 30px 0; }
.rsk-list { list-style: none; margin: 0; padding: 0; }
.rsk-list li { position: relative; padding-left: 16px; margin-bottom: 7px; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 20px; color: #444; }
.rsk-list li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: #A5B374; }
.rsk-list li:last-child { margin-bottom: 0; }
.rsk-label { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; line-height: 20px; color: #1a1a1a; margin: 0 0 8px; }

/* ERM objective boxes / categories — single column */
.rsk-boxset { display: grid; grid-template-columns: 1fr; gap: 18px; }
/* Risk Categorisation — no box; teal sub-header, black body text */
.rsk-box { border: 0; padding: 0; }
.rsk-box h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #5DC4BB; margin: 0 0 6px; }
.rsk-box p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #222; margin: 0; }

/* Governance / role blocks */
.rsk-roles { display: grid; grid-template-columns: 1fr; gap: 20px; }
/* Role-block sub-headers (Governance + Process) in black */
.rsk-role h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #222; margin: 0 0 8px; }

/* Diagram placeholder */
.rsk-diagram-ph { width: 100%; min-height: 320px; }

/* Risk cards — single column; teal header; no outer outline */
.rsk-cards { display: grid; grid-template-columns: 1fr; gap: 40px; }
.rsk-card { background: #fff; border: 0; padding: 0; }
.rsk-card-head { display: flex; align-items: stretch; margin-bottom: 18px; }
.rsk-card-label { background: var(--rsk-teal-lt); color: #fff; flex: none; display: flex; align-items: center; padding: 0 15px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; }
.rsk-card-title-wrap { flex: 1; border: 2px solid var(--rsk-teal-lt); border-top: none; padding: 10px 16px; display: flex; align-items: center; }
.rsk-card-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; color: var(--rsk-teal); }
.rsk-card-body { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 26px; }
.rsk-meta { display: flex; flex-direction: column; }
.rsk-desc { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #444; margin: 0 0 16px; }
.rsk-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.rsk-badges:last-child { margin-bottom: 0; }
.rsk-sbadge { flex: none; min-width: 30px; height: 26px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid #6f8f3f; color: #6f8f3f; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 12px; }
.rsk-mbadge { flex: none; min-width: 32px; height: 26px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid var(--rsk-teal); color: var(--rsk-teal); font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 12px; }
.rsk-icorow { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.rsk-ico-ph { flex: none; width: 28px; height: 28px; background: #e4e8dc; border: 1px dashed #b7c0b0; display: inline-flex; align-items: center; justify-content: center; font-family: 'Noto Sans', sans-serif; font-size: 8px; font-weight: 700; color: #8a9584; }
.rsk-opp-box { border: 1px solid #cdd7bf; background: #fff; box-shadow: 0 8px 16px -6px rgba(0,0,0,.12); padding: 18px 20px; align-self: start; }
.rsk-opp-box h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 10px; }
.rsk-opp-box p { font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.55; color: #444; margin: 0; }

/* SR1 climate card — left meta column + table + full-width opportunities */
.rsk-climate-body { display: grid; grid-template-columns: 150px 1fr; column-gap: 34px; row-gap: 24px; align-items: start; }
.rsk-climate-opp { grid-column: 2; margin: 0; }
.rsk-climate-table { width: 100%; border-collapse: collapse; margin: 0; }
.rsk-climate-table th { background: transparent; text-align: left; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13.5px; color: #1a1a1a; padding: 0 16px 9px 0; border: none; border-bottom: 2px solid #333; vertical-align: bottom; }
.rsk-climate-table td { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.55; color: #222; padding: 13px 16px 13px 0; border: none; border-bottom: 1px solid #e2e2e2; vertical-align: top; }
.rsk-climate-table th:last-child, .rsk-climate-table td:last-child { padding-right: 0; }
.rsk-climate-risk { display: block; color: #5DC4BB; font-weight: 700; font-size: 13.5px; margin-bottom: 5px; }
.rsk-climate-desc { display: block; color: #222; }

/* ============================================================
   INNER PAGE — Our ESG Approach (pages 102-111)  [prefix .esa-]
   Reuses .green-hero (title-only) + .acc-* text + .img-ph
   NOTE: template already owns .esg-* classes — do NOT reuse.
   ============================================================ */
.esa-page { --acc-green:#2f9c6a; --acc-teal:#178b7f; }
.esa-section { padding: 32px 0; }
.esa-section:last-of-type { padding-bottom: 90px; }

/* CSO message — light-green full-width panel, text flows left-to-right */
.esa-cso { background: #eef5ec; padding: 30px 34px; margin-top: 10px; }
.esa-cso .acc-body { color: #33473c; }
.esa-cso-name { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 18px 0 2px; }
.esa-cso-role { font-family: 'Noto Sans', sans-serif; font-size: 13.5px; color: #5a6b60; margin: 0; }

/* Vision / Purpose / Goals — plain text (no panel) */
.esa-vpg-item { margin-top: 20px; }
.esa-vpg-item h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #2f9c6a; margin: 0 0 6px; }
.esa-vpg-item p { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7; color: #444; margin: 0; }
.esa-vpg-item ul { margin: 6px 0 0; padding-left: 0; list-style: none; }
.esa-vpg-item li { position: relative; font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.6; color: #444; margin: 0 0 8px; padding-left: 18px; }
.esa-vpg-item li::before { content: ""; position: absolute; left: 0; top: 10px; width: 8px; height: 8px; background: #A5B374; }
.esa-vpg-item li:last-child { margin-bottom: 0; }

/* Responsibility pillars — green pill/tab heading on a light-green patch */
.esa-pillar { margin-top: 26px; }
.esa-pillar:first-of-type { margin-top: 14px; }
.esa-pillar-head { display: inline-block; background: #7a9b45; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; padding: 11px 26px; margin: 0 0 16px; }
.esa-sdg-label { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; color: #444; margin: 0 0 8px; }
.esa-sdg-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 14px; }
.esa-sdg-ph { width: 56px; height: 56px; min-height: 0; }

/* diagram placeholders (org chart, ratings dashboard, policy structure) */
.esa-diagram-ph { width: 100%; min-height: 440px; }
/* Policy Structure block (E/S/G columns + base bands) */
.esa-polstruct { margin: 10px 0 0; }
.esa-polcols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }
.esa-polcol { overflow: hidden; }
.esa-poltab { color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 15px; letter-spacing: .6px; padding: 14px 20px; }
.esa-pollist { list-style: none; margin: 0; padding: 18px 20px 24px; }
.esa-pollist li { position: relative; padding-left: 20px; margin-bottom: 12px; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.45; color: #333; }
.esa-pollist li:last-child { margin-bottom: 0; }
.esa-pollist li::before { content: ""; position: absolute; left: 0; top: 6px; width: 8px; height: 8px; }
.esa-polcol--env .esa-poltab { background: #0aa06e; }
.esa-polcol--env .esa-pollist { background: #eaf6f1; }
.esa-polcol--env .esa-pollist li::before { background: #0aa06e; }
.esa-polcol--soc .esa-poltab { background: #0093d0; }
.esa-polcol--soc .esa-pollist { background: #e7f4fb; }
.esa-polcol--soc .esa-pollist li::before { background: #0093d0; }
.esa-polcol--gov .esa-poltab { background: #ef7d22; }
.esa-polcol--gov .esa-pollist { background: #fdf1e7; }
.esa-polcol--gov .esa-pollist li::before { background: #ef7d22; }
.esa-polrow { text-align: center; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #333; padding: 16px; margin-top: 14px; background: #f5f8f9; border-top: 3px solid #ccc; }
.esa-polrow--env { border-top-color: #0aa06e; background: #eef7f3; }
.esa-polrow--gov { border-top-color: #ef7d22; background: #fdf4ed; }
.esa-polrow--soc { border-top-color: #0093d0; background: #eef6fb; }
@media (max-width: 800px) { .esa-polcols { grid-template-columns: 1fr; } }

/* ESG Value Creation Framework — logo rows (built, not an image) */
.esa-fw-sub { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 22px 0 12px; }
.esa-logo-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin: 0 0 8px; }
.esa-logo-ph { width: 100%; height: 66px; min-height: 0; }

/* captioned photo */
.esa-photo { position: relative; margin: 26px 0; }
.esa-photo-ph { width: 100%; min-height: 360px; }
.esa-photo-cap { display: inline-flex; align-items: center; gap: 10px; background: #fff; padding: 9px 16px; margin-top: 10px; font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333; }
/* marker: see the site-wide photo-caption marker rule */

/* Awards — 4 big-image cards (photo, 2-up half width) + 3 emblem cards */
.esa-award-biggrid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 18px; }
.esa-award-big { border: 1px solid #d8ddcd; }
.esa-award-big .img-ph { width: 100%; min-height: 240px; }
.esa-award-big p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; margin: 0; padding: 16px 20px; }
.esa-awards-sub { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 26px 0 14px; }
.esa-award { display: grid; grid-template-columns: 72px 1fr; gap: 20px; align-items: center; border: 1px solid #d8ddcd; padding: 18px 22px; margin-bottom: 16px; }
.esa-award-ico .img-ph { width: 72px; height: 72px; min-height: 0; }
.esa-award p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; margin: 0; }

/* Performance-against-goals tables — colour-coded per pillar */
.esa-perf-block { margin-bottom: 30px; }
.esa-perf--env { --esa-c: #2f9c6a; --esa-tint: #eef5f0; }
.esa-perf--soc { --esa-c: #2bb6d6; --esa-tint: #e9f6fb; }
.esa-perf--gov { --esa-c: #f07d1a; --esa-tint: #fdf1e6; }
.esa-perf-pillar { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; color: var(--esa-c); margin: 4px 0 12px; }
.esa-table-wrap { width: 100%; overflow-x: auto; margin: 0; }
.esa-perf-table { width: 100%; min-width: 620px; border-collapse: collapse; border-top: 2px solid var(--esa-c); border-bottom: 2px solid var(--esa-c); }
.esa-perf-table th { background: transparent; color: #1a1a1a; text-align: left; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; padding: 11px 14px; border: none; border-bottom: 1.5px solid var(--esa-c); vertical-align: bottom; }
.esa-perf-table th:nth-child(2) { background: var(--esa-c); color: #fff; }
.esa-perf-table td { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.5; color: #333; padding: 11px 14px; border: none; border-bottom: 1px solid #e8e8e8; vertical-align: top; }
.esa-perf-table td:nth-child(2) { background: var(--esa-tint); }
.esa-perf-table th:first-child, .esa-perf-table td:first-child { width: 34%; }
.esa-perf-cat td { background: transparent; font-weight: 700; color: #1a1a1a; }

/* ============================================================
   INNER PAGE — Environment (chapter, pp. 112-…)  [prefix .env-]
   Reuses .green-hero + .perf-metric/.perf-grid + .nrc-chart + .acc-*
   ============================================================ */
.env-page { --acc-green: #159E7A; --acc-teal: #159E7A; --perf-green: #159E7A; }
/* Environment — chapter-opener hero (reference mint, GIF shown uncropped) */
.env-page .syn-hero.green-hero { background: #e4efec; padding-top: 130px; }
.env-page .green-hero .syn-hero-title { color: #00b16b; }
.env-page .green-hero .syn-hero-row { grid-template-columns: 1fr 1.3fr; align-items: end; min-height: 0; }
.env-page .green-hero .syn-hero-text { padding: 10px 0 46px; }
.env-page .green-hero .syn-hero-img { position: static; overflow: visible; align-self: end; }
.env-page .green-hero .syn-hero-img img { position: static; width: 100%; height: auto; object-fit: contain; display: block; }
@media (max-width: 900px) {
    .env-page .green-hero .syn-hero-row { grid-template-columns: 1fr; gap: 16px; }
    .env-page .green-hero .syn-hero-text { padding: 0 0 20px; }
}
.env-section { padding: 20px 0; }
.env-section:last-of-type { padding-bottom: 90px; }
/* a section-leading heading shouldn't add its own top margin on top of the
   section padding (was stacking to ~94px above every new heading) */
.env-section > .container > .env-h:first-child,
.env-section > .container > .env-h--sm:first-child,
.env-section > .container > .env-h3:first-child { margin-top: 0; }
/* --- Environment type scale ---
   28 headings · 30 numbers · 20 sub-headings (.acc-h) · 18 lead/quote
   · 16 badges · 15 body · 14 all small text (labels/captions/lead-ins) */
.env-h, .env-h--sm { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 28px; line-height: 1.2; color: #159E7A; margin: 0 0 16px; }
.env-subnote { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .02em; text-transform: uppercase; color: #1a1a1a; margin: 30px 0 14px; }

/* Key Linkages — stacked label groups */
.env-linkages { display: grid; grid-template-columns: 1fr; gap: 22px; margin-top: 8px; }
.env-link-label { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 10px; }
.env-badges { display: flex; flex-wrap: wrap; gap: 8px; }
/* Key-Linkages code badges — corner bracket (left + bottom), colour per group */
.env-badge { flex: none; min-width: 48px; height: 42px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: none; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; color: #009540; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 16px; }
.env-badge--s { color: #6f8f3f; }   /* Strategic Priorities — olive */
.env-badge--r { color: #7fb0a6; }   /* Key Risks & Opportunities — teal-grey */
/* Corporate Governance Key Linkages — smaller M/S/R badges */
.gov-page .env-badges { gap: 6px; }
.gov-page .env-badge { min-width: 34px; height: 28px; padding: 0 8px; font-size: 12px; }
/* Responsible Supply Chain — smaller M/S/R badges (same as gov) */
.rsc-page .env-badges { gap: 6px; }
.rsc-page .env-badge { min-width: 34px; height: 28px; padding: 0 8px; font-size: 12px; }
/* Occupational Health & Safety — smaller M/S/R badges (OHS page only) */
.ohs-page:not(.rsc-page):not(.csr-page) .env-badges { gap: 6px; }
.ohs-page:not(.rsc-page):not(.csr-page) .env-badge { min-width: 34px; height: 28px; padding: 0 8px; font-size: 12px; }
/* Corporate Social Responsibility — smaller M/S/R badges */
.csr-page .env-badges { gap: 6px; }
.csr-page .env-badge { min-width: 34px; height: 28px; padding: 0 8px; font-size: 12px; }
/* People — two-column chapter-opener hero (reference blue) */
.pep-hero.people-hero { min-height: 0; display: block; background: #e3f1fa; }
.people-hero .pep-eyebrow { color: #1a1a1a; }
.people-hero .pep-title { color: #00a7dd; }
.people-hero .container { padding-top: 130px; padding-bottom: 0; }
.people-hero-row { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; align-items: end; }
.people-hero-text { align-self: center; padding: 10px 0 46px; }
.people-hero-fig { align-self: end; }
.people-hero-fig img { width: 100%; display: block; }
@media (max-width: 900px) {
    .people-hero-row { grid-template-columns: 1fr; gap: 16px; }
    .people-hero-text { padding: 0 0 20px; }
}
/* Corporate Social Responsibility — two-column chapter-opener hero (reference blue) */
.csr-page .pep-hero.csr-hero { min-height: 0; display: block; background: #e2f0f9; }
.csr-page .csr-hero .pep-eyebrow { color: #1a1a1a; }
.csr-page .csr-hero .pep-title { color: #00a7dd; }
.csr-page .csr-hero .pep-subtitle { color: #3a4a55; }
.csr-page .csr-hero .container { padding-top: 130px; padding-bottom: 0; }
.csr-hero-row { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; align-items: end; }
.csr-hero-text { align-self: center; padding: 10px 0 46px; }
.csr-hero-fig { align-self: end; }
.csr-hero-fig img { width: 100%; display: block; }
@media (max-width: 900px) {
    .csr-hero-row { grid-template-columns: 1fr; gap: 16px; }
    .csr-hero-text { padding: 0 0 20px; }
}
/* Occupational Health & Safety — two-column chapter-opener hero (reference blue) */
.ohs-page .pep-hero.ohs-hero { min-height: 0; display: block; background: #e0f0fa; }
.ohs-page .ohs-hero .pep-eyebrow { color: #1a1a1a; }
.ohs-page .ohs-hero .pep-title { color: #00a7dd; }
.ohs-page .ohs-hero .pep-subtitle { color: #3a4a55; }
.ohs-page .ohs-hero .container { padding-top: 130px; padding-bottom: 0; }
.ohs-hero-row { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; align-items: end; }
.ohs-hero-text { align-self: center; padding: 10px 0 46px; }
.ohs-hero-fig { align-self: end; }
.ohs-hero-fig img { width: 100%; display: block; }
@media (max-width: 900px) {
    .ohs-hero-row { grid-template-columns: 1fr; gap: 16px; }
    .ohs-hero-text { padding: 0 0 20px; }
}
/* Responsible Supply Chain — two-column chapter-opener hero (reference blue) */
.rsc-page .pep-hero.rsc-hero { min-height: 0; display: block; background: #d9ecf6; }
.rsc-page .rsc-hero .pep-eyebrow { color: #1a1a1a; }
.rsc-page .rsc-hero .pep-title { color: #00a7dd; }
.rsc-page .rsc-hero .pep-subtitle { color: #3a4a55; }
.rsc-page .rsc-hero .container { padding-top: 130px; padding-bottom: 0; }
.rsc-hero-row { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; align-items: end; }
.rsc-hero-text { align-self: center; padding: 10px 0 46px; }
.rsc-hero-fig { align-self: end; }
.rsc-hero-fig img { width: 100%; display: block; }
@media (max-width: 900px) {
    .rsc-hero-row { grid-template-columns: 1fr; gap: 16px; }
    .rsc-hero-text { padding: 0 0 20px; }
}
.env-icorow { display: flex; flex-wrap: wrap; gap: 10px; }
.env-ico-ph { width: 48px; height: 48px; min-height: 0; }
.env-sdg-ph { width: 52px; height: 52px; min-height: 0; }

/* Quote panel (deep-teal) */
.env-quote { background: #0F6F5E; color: #fff; padding: 34px 36px; margin-top: 12px; }
.env-quote-ph { width: 60px; height: 46px; min-height: 0; margin-bottom: 18px; }
.env-quote p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; line-height: 1.5; margin: 0; color: #fff; }

/* Approach — text + image */
.env-imgrow { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; align-items: start; }
.env-imgrow .img-ph { min-height: 320px; }

/* Metric lead-in line above a .perf-num */
.env-metric-lead { display: block; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.4; color: #555; margin: 0 0 6px; }
/* teal caption line under a .perf-num, no leading dash (e.g. "planted across N hectares") */
.perf-metric p.env-msub { color: #159E7A; padding-left: 0; margin-top: 6px; }
.perf-metric p.env-msub::before { display: none; }
/* numbers unified to 30 (scope perf-num down from its global 34 max) + chart unit to 14 */
.env-page .perf-num { font-size: 30px; }
.env-page .nrc-chart-unit { font-size: 14px; }

/* Big stat blocks (Waste / Biodiversity) — side by side, gradient numbers */
.env-stat { margin-bottom: 24px; }
.env-stat-row { display: flex; flex-wrap: wrap; gap: 34px; margin-bottom: 8px; }
.env-stat-row .env-stat { flex: 1 1 200px; margin-bottom: 0; }
.env-stat-num {
    display: block; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 30px; line-height: 1.2;
    color: #009E8C; /* fallback */
    background: linear-gradient(90deg, #00B7B2 0%, #009E8C 45%, #008852 100%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.env-stat p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #444; margin: 6px 0 0; }

/* Milestone callout + energy-security boxes */
.env-milestone { background: #dff0ea; border: 1px solid #b9ddd2; padding: 18px 24px; text-align: center; font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.5; color: #155245; margin: 0 auto 24px; max-width: 540px; }
.env-milestone b { color: #0F6F5E; }
.env-box { border: 1px solid #b9ddd2; border-top: 3px solid #159E7A; padding: 18px 22px; margin-bottom: 16px; font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.55; color: #333; }
.env-box b { color: #0F6F5E; }
.env-policy-link { display: inline-flex; align-items: center; gap: 8px; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 700; color: #159E7A; margin-top: 18px; }
.env-policy-link i { color: #159E7A; }
.env-diagram-ph { width: 100%; min-height: 300px; }

/* sub-heading (ENOC / CII-Net Zero / Electrifying / Key Linkages / Net Zero — teal by default, add inline black where needed) — one size for all sub-headings */
.env-h3 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #159E7A; margin: 26px 0 10px; }

/* captioned figure (Bhadla / Khavda) */
.env-figure { margin: 12px 0 6px; }
.env-figure .img-ph { width: 100%; min-height: 360px; }
.env-figcap { display: inline-flex; align-items: center; gap: 10px; font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333; margin-top: 10px; }
/* marker: see the site-wide photo-caption marker rule */

/* Climate risk / opportunity tables */
.env-ctable-note { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #1a1a1a; margin: 0 0 14px; }
/* Environment — smaller M/S/R badges (as on other pages) */
.env-page .env-badges { gap: 6px; }
.env-page .env-badge { min-width: 34px; height: 28px; padding: 0 8px; font-size: 12px; }
/* GHG footprint donut legend */
.env-ghg-legend { list-style: none; margin: 14px 0 0; padding: 0; }
.env-ghg-legend li { display: flex; align-items: center; gap: 10px; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #333; margin-bottom: 8px; }
.env-ghg-legend li:last-child { margin-bottom: 0; }
.env-ghg-legend li .env-sw { width: 12px; height: 12px; flex: none; display: inline-block; }
.env-ghg-total { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #1a1a1a; margin: 14px 0 0; }
/* Target caption under the decarbonisation charts */
.env-target { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; margin: 12px 0 0; }
.env-target i { color: #555; }
/* Divider between Waste Management and Biodiversity Management sections */
#envBioDetail > .container { border-top: 1px solid #d8e2dd; padding-top: 30px; }
.env-table-wrap { width: 100%; overflow-x: auto; margin: 0 0 8px; }
.env-ctable { width: 100%; min-width: 640px; border-collapse: collapse; border-top: 2px solid #159E7A; border-bottom: 2px solid #159E7A; }
.env-ctable th { text-align: left; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; color: #1a1a1a; padding: 12px 14px; border-bottom: 2px solid #159E7A; vertical-align: bottom; }
.env-ctable td { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.5; color: #333; padding: 11px 14px; border-bottom: 1px solid #d8e2d2; vertical-align: top; }
.env-ctable td.env-ct-cat { color: #159E7A; font-weight: 600; }

/* Climate strategy rows (label box + bullets) */
.env-strategy-lead { font-family: 'Noto Sans', sans-serif; font-size: 15px; color: #333; margin: 16px 0; }
.env-strategy-row { display: grid; grid-template-columns: 210px 1fr; align-items: stretch; margin-bottom: 18px; box-shadow: 0 8px 18px -10px rgba(0,0,0,.18); }
.env-strategy-label { background: #dfeee8; padding: 22px 24px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; line-height: 1.35; color: #1a1a1a; display: flex; align-items: flex-start; }
.env-strategy-body { background: #fff; border: 1px solid #e6e6e6; border-left: none; padding: 20px 24px; }
.env-strategy-body ul { margin: 0; padding-left: 0; list-style: none; }
.env-strategy-body li { position: relative; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; margin: 0 0 10px; padding-left: 18px; }
.env-strategy-body li::before { content: ""; position: absolute; left: 0; top: 8px; width: 7px; height: 7px; background: #159E7A; }
.env-strategy-body li:last-child { margin-bottom: 0; }

/* teal-square bullet list */
.env-blist { margin: 0 0 16px; padding-left: 0; list-style: none; }
.env-blist li { position: relative; font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; margin: 0 0 9px; padding-left: 18px; }
.env-blist li::before { content: ""; position: absolute; left: 0; top: 8px; width: 7px; height: 7px; background: #159E7A; }
.env-blist li:last-child { margin-bottom: 0; }
.env-blist b { color: #1a1a1a; }

/* CO2-avoidance callout box */
.env-callout-box { border: 1px solid #cfe0c4; border-left: 4px solid #7a9b45; background: #f6f9ef; padding: 22px 26px; margin: 20px 0; max-width: 440px; }
.env-callout-num { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 30px; line-height: 1.2; color: #009E8C; background: linear-gradient(90deg, #00B7B2 0%, #009E8C 45%, #008852 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.env-callout-box p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.5; color: #444; margin: 6px 0 0; }

/* UNESCO / recognition highlight box */
.env-hlbox { border: 1px solid #cfe0c4; padding: 26px 28px; margin: 22px 0; }
.env-hlbox .env-h3:first-child { margin-top: 0; }
.env-hlbox p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #333; margin: 0 0 14px; }
.env-logo-row { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin: 8px 0 22px; }
.env-logo-row .img-ph { width: 130px; height: 58px; min-height: 0; }
.env-sdg7 { display: flex; align-items: flex-start; gap: 16px; }
.env-sdg7 .img-ph { width: 64px; height: 64px; min-height: 0; flex: none; }
.env-sdg7 p { margin: 0; }

/* Water conservation / impact boxes (tab header + body) */
.env-wbox { border: 1px solid #bcd9d0; margin-bottom: 22px; }
.env-wbox-tab { display: inline-block; background: #e7eff0; padding: 10px 20px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; }
.env-wbox-body { padding: 18px 24px 24px; }
.env-wbox-body h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 18px 0 8px; }
.env-wbox-body h4:first-child { margin-top: 0; }

/* TNFD deep-teal panel */
.env-tnfd-panel { background: #0F6F5E; color: #fff; padding: 30px 34px; margin: 22px 0 0; }
.env-tnfd-panel h3 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #fff; margin: 0 0 14px; }
.env-tnfd-panel p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #fff; margin: 0; }

/* Big teal pull-quote with leading dash */
.env-pullquote { position: relative; padding-left: 24px; margin: 26px 0; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; line-height: 1.5; color: #159E7A; }
.env-pullquote::before { content: ""; position: absolute; left: 0; top: 13px; width: 15px; height: 3px; background: #159E7A; }

/* IBBI alignment quote box */
.env-quotebox { border: 1px solid #cfe0c4; box-shadow: 0 10px 22px -12px rgba(0,0,0,.18); padding: 22px 24px; margin: 14px 0; max-width: 440px; }
.env-quotebox p { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.6; color: #6f8f3f; margin: 0; }

/* ============================================================
   SOCIAL — People (tabbed page, pp.130-145)  [prefix .pep-]
   Common banner + sticky tab nav + JS-switched panels
   (structure mirrors ecc-hero/ecc-nav; square tabs per no-radius rule)
   ============================================================ */
.pep-page { --pep-blue: #1478be; --pep-deep: #0e6ab5; --pep-cyan: #2ba6e0; --pep-teal: #12a0a0; --acc-green: #2f9c6a; --perf-green: #2ba6e0; }
.pep-hero { background: #0e6ab5; overflow: hidden; display: flex; flex-direction: column; min-height: 56vh; }
.pep-hero .container { padding-top: 130px; padding-bottom: 28px; flex: 0 0 auto; }
.pep-eyebrow { display: block; font-family: 'Noto Sans', sans-serif; font-size: 15px; font-weight: 700; color: #a9d4ef; margin-bottom: 14px; }
.pep-title { font-family: 'Playfair Display', serif; font-size: clamp(32px, 4vw, 52px); font-weight: 700; line-height: 1.08; color: #eaf6ff; margin: 0; max-width: 720px; }
.pep-subtitle { font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.6; font-weight: 600; color: #cfe6f7; margin: 18px 0 0; max-width: 660px; }
.pep-hero-figure { position: relative; flex: 1 1 auto; min-height: 220px; overflow: hidden; }
.pep-hero-figure .img-ph { width: 100%; height: 100%; min-height: 220px; }

/* sticky tab nav — sits below the header; pins to the very top when the
   site header hides on scroll-down (#header.header-hidden) */
.pep-nav { background: #fff; border-bottom: 1px solid #dbe8f2; position: sticky; top: 84px; z-index: 900; transition: top .35s ease; }
#header.header-hidden ~ .pep-nav,
.pep-nav.is-pinned { top: 0; }
.pep-nav-scroll { display: flex; gap: 6px; overflow-x: auto; padding: 10px 0; }
.pep-nav-link { flex: 0 0 auto; padding: 10px 20px; border: none; background: transparent; cursor: pointer; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 600; color: #35485a; white-space: nowrap; transition: background .2s, color .2s; }
.pep-nav-link:hover { background: #e9f4fc; color: #0e6ab5; }
.pep-nav-link.is-active { background: #0e6ab5; color: #fff; }

/* panels */
.pep-panel { display: none; }
.pep-panel.is-active { display: block; }
.pep-section { padding: 34px 0; }
.pep-section:last-of-type { padding-bottom: 90px; }
.pep-placeholder { padding: 60px 0; text-align: center; font-family: 'Noto Sans', sans-serif; font-size: 15px; color: #888; }

/* --- People content components --- */
.pep-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #159E7A; margin: 0 0 14px; }
.pep-lead { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7; color: #444; margin: 0 0 22px; }
.pep-body { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7; color: #444; margin: 0 0 18px; }
.pep-subnote { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 24px 0 12px; }

/* blue centered block header (Adani Group EVP / What Sets Us Apart / EVP Aligned…) */
.pep-blockhead { display: block; text-align: center; background: #1478be; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; padding: 11px 26px; margin: 26px auto 20px; max-width: 460px; position: relative; z-index: 2; }
/* when a block header sits above a bordered box / blue patch, straddle its top line */
.pep-blockhead:has(+ .pep-box),
.pep-blockhead:has(+ .pep-lbwrap) { margin-bottom: -23px; }

/* Vision / Mission box (blue tab + light body) */
.pep-vmrow { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 6px 0 8px; }
.pep-vmbox { border: 1px solid #cfe3f2; background: #eef6fc; }
.pep-vmbox-tab { display: inline-block; background: #1478be; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; padding: 9px 20px; }
.pep-vmbox-body { padding: 18px 22px; background: #eef6fc; }
.pep-vmbox-body p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #333; margin: 0; }

/* quote band */
.pep-quote { background: #1478be; color: #fff; padding: 30px 34px; margin: 6px 0 8px; }
.pep-quotemark { width: 58px; height: 42px; min-height: 0; margin-bottom: 16px; }
.pep-quote p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 17px; line-height: 1.5; margin: 0; color: #fff; }

/* EVP dimension grid */
.pep-evp-grid { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 2px solid #2ba6e0; border-bottom: 2px solid #2ba6e0; }
.pep-evp-col { padding: 16px 14px; border-right: 1px solid #d6e6f2; }
.pep-evp-col:last-child { border-right: none; }
.pep-evp-col h5 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; color: #1a1a1a; margin: 0 0 6px; }
.pep-evp-col p { font-family: 'Noto Sans', sans-serif; font-size: 12.5px; line-height: 1.45; color: #555; margin: 0; }

/* numbered items (What Sets Us Apart) */
.pep-numgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 34px; }
.pep-num-item { display: grid; grid-template-columns: 34px 1fr; gap: 12px; }
.pep-num-item .pep-n { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 24px; color: #2ba6e0; line-height: 1; }
.pep-num-item h5 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 4px; }
.pep-num-item p { font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.5; color: #555; margin: 0; }

/* card with cyan label (EVP Aligned / Change Mgmt) */
.pep-cardgrid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 22px; }
.pep-card-label { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #0e6ab5; margin: 0 0 8px; }

/* bordered box for EVP / What-Sets-Us-Apart / EVP-Aligned groups */
.pep-box { border: 1px solid #cfe3f2; padding: 46px 26px 22px; margin-bottom: 8px; }

/* label + bullets rows (Leadership Governance etc.) — on a light-blue patch;
   white box on the LHS label, a divider line, bullets open on the blue */
.pep-lbwrap { background: #e9f3fb; padding: 46px 26px 24px; }
.pep-lbrow { display: grid; grid-template-columns: 210px 1fr; gap: 26px; align-items: stretch; margin-bottom: 18px; }
.pep-lbrow:last-child { margin-bottom: 0; }
.pep-lbrow-label { background: #fff; border: 1px solid #d6e6f2; padding: 14px 16px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; }
.pep-lbwrap .pep-blist { background: transparent; border: none; border-bottom: 1px solid #c7d9ea; padding: 2px 0 16px; margin: 0; }
.pep-lbrow:last-child .pep-blist { border-bottom: none; }

/* blue-square bullet list */
.pep-blist { margin: 0; padding-left: 0; list-style: none; }
.pep-blist li { position: relative; padding-left: 16px; font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.5; color: #333; margin: 0 0 7px; }
.pep-blist li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: #2ba6e0; }
.pep-blist li:last-child { margin-bottom: 0; }

/* Highlights (976, 194…) — reuse .perf-metric with cyan numbers via --perf-green */
.pep-hl-img { margin-bottom: 18px; }
.pep-hl-img .img-ph { width: 100%; min-height: 200px; }

/* --- Preparing for the Future tab --- */
.pep-th { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #178b7f; margin: 18px 0 6px; }
.pep-blkh { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 24px 0 8px; }
.pep-blkh--lg { font-size: 18px; }
.pep-figure { margin: 14px 0; }
.pep-figure .img-ph { width: 100%; min-height: 340px; }
.pep-policy-link { display: inline-flex; align-items: center; gap: 8px; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 700; color: #2f9c6a; margin-top: 8px; }
.pep-policy-link i { color: #2f9c6a; }
/* green pull-quote */
.pep-pullquote { display: flex; gap: 18px; align-items: flex-start; margin: 10px 0 24px; }
.pep-pullquote .img-ph { width: 54px; height: 40px; min-height: 0; flex: none; }
.pep-pullquote p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 20px; line-height: 1.5; color: #6f8f3f; margin: 0; }
/* Measuring Training Effectiveness rows (light-blue label box + teal bullets + divider) */
.pep-trow { display: grid; grid-template-columns: 200px 1fr; gap: 26px; align-items: start; padding-bottom: 16px; border-bottom: 1px solid #d8e2ea; margin-bottom: 16px; }
.pep-trow:last-child { border-bottom: none; }
.pep-trow-label { background: #e3f1fa; padding: 14px 16px; }
.pep-trow-label b { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; }
.pep-trow-label span { display: block; font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #555; margin-top: 2px; }
.pep-trow .pep-blist li { color: #178b7f; }
.pep-trow .pep-blist li::before { background: #178b7f; }
/* Preparing-for-the-Future tab — AGEL green accents (green section headings,
   bullets, numbers); tab title is cyan #38C0DC (set inline). Teal sub-headings #178b7f. */
#pepFuture { --perf-green: #2ba6e0; }
#pepFuture .perf-metric p::before { background: #2ba6e0; }
/* slightly wider columns so the FY 2025-26 caption sits on one line */
#pepFuture .perf-grid--3 { column-gap: 16px; }
/* Succession Planning Process — 3-level flow */
.pep-succession { max-width: 760px; margin: 14px 0 0; }
.pep-succ-box { background: #e6f3fb; padding: 18px 24px; text-align: center; box-shadow: 3px 3px 0 rgba(43,166,224,.28); }
.pep-succ-lvl { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin-bottom: 6px; }
.pep-succ-box p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; margin: 0; }
.pep-succ-box--final p { color: #2ba6e0; font-weight: 700; }
.pep-succ-arrow { display: block; text-align: center; color: #2ba6e0; font-size: 15px; line-height: 1; margin: 10px 0; }
#pepFuture .pep-h { color: #2f9c6a; margin-top: 30px; }
#pepFuture .pep-title-cyan { margin-top: 0; }
#pepFuture .pep-title-cyan { color: #38C0DC; }
#pepFuture .pep-blist li::before { background: #2f9c6a; }
#pepFuture .pep-trow .pep-blist li { color: #1a1a1a; }
#pepFuture .pep-trow .pep-blist li::before { background: #178b7f; }
/* blue outline box */
.pep-obox { border: 1px solid #1478be; padding: 24px 28px; }
/* 2-column flow for dense sections (like the PDF) */
.pep-cols { column-count: 2; column-gap: 46px; }
.pep-cols > * { break-inside: avoid; }
.pep-cols h3, .pep-cols h4, .pep-cols h5 { break-after: avoid; }
.pep-cols .pep-th:first-child, .pep-cols .pep-blkh:first-child { margin-top: 0; }

/* --- Care and Motivation tab --- */
#pepCare .pep-section { padding: 22px 0; }
#pepCare .pep-h { color: #2f9c6a; margin: 0 0 12px; }
#pepCare .pep-h--black { color: #1a1a1a; }
#pepCare .pep-h--teal { color: #12ADAF; }
#pepCare .pep-body { margin-bottom: 16px; }
#pepCare .pep-blkh { margin-top: 20px; }
#pepCare .pep-blist li::before { background: #2f9c6a; }
#pepCare .pep-trow { align-items: stretch; }
#pepCare .pep-trow .pep-blist { border-left: 1px solid #d8e2ea; padding-left: 24px; }
#pepCare .pep-trow .pep-blist li { color: #333; }
#pepCare .pep-trow .pep-blist li::before { background: #2f9c6a; }
/* Khavda box — all sub-headings black, uniform 15px text, breathing room between sub-sections */
#pepCare .pep-khavda-body .pep-h { color: #1a1a1a; margin-top: 4px; font-size: 15px; }
#pepCare .pep-khavda-body .pep-blist li { font-size: 15px; }
#pepCare .pep-khavda-body .pep-blist { margin-bottom: 22px; }
#pepCare .pep-khavda-body .pep-blist:last-child { margin-bottom: 0; }
#pepCare .pep-cm-wf { margin-top: 10px; }

/* Meaningful Employee Engagement — three cards with angled blue header */
.pep-eng-grid { display: grid; grid-template-columns: 1fr; gap: 22px; align-items: start; }
.pep-eng-head { position: relative; background: #d9e7f2; min-height: 64px; display: flex; align-items: center; padding: 14px 18px 14px 62px; overflow: hidden; }
.pep-eng-head::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 46px; background: #0d5da6; clip-path: polygon(0 0, 100% 0, 55% 50%, 100% 100%, 0 100%); }
.pep-eng-head b { position: relative; z-index: 2; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; line-height: 1.3; color: #123a63; }
.pep-eng-body { padding: 16px 6px 0; }
.pep-num-hl { color: #1a1a1a; font-weight: 700; }

/* lower 3-column block (dense text 2-col + Way Forward list) */
.pep-cm-lower { display: grid; grid-template-columns: 2fr 1fr; gap: 40px; align-items: start; }

/* closing photo grid — two stacked left, one tall right */
.pep-photo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 30px; align-items: stretch; }
.pep-photo-col { display: grid; grid-template-rows: 1fr 1fr; gap: 20px; }
.pep-photo-grid .img-ph { width: 100%; min-height: 210px; height: 100%; }
.pep-photo-tall .img-ph { min-height: 440px; }

/* --- Human Rights and Labour Relations tab --- */
#pepRights .pep-h { color: #2f9c6a; margin-top: 0; }
#pepRights .pep-h + .pep-body + .pep-h { margin-top: 26px; }
#pepRights .env-imgrow .img-ph { min-height: 520px; }
#pepRights .pep-pullquote { margin-top: 34px; align-items: flex-start; }
#pepRights .pep-pullquote p { color: #3f9c4f; font-size: 20px; line-height: 1.5; }
#pepRights .pep-quote-ico { width: 60px; height: 48px; min-height: 0; flex: none; }

/* ============================================================
   INNER PAGE — Occupational Health and Safety (.ohs-)
   Social pillar, blue theme. Reuses env-linkages/env-badge,
   perf-grid/perf-metric, env-figure/env-figcap.
   ============================================================ */
.ohs-page { --perf-green: #2ba6e0; }
/* big blue highlight numbers → cyan-to-blue gradient text */
.ohs-page .perf-num {
	font-size: 34px; line-height: 1.15;
	background: linear-gradient(90deg, #00b5d8 0%, #009dcc 40%, #0079b8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}

/* headings / text */
.ohs-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #2f9c6a; margin: 30px 0 12px; }
.ohs-section > .container > .ohs-h:first-child { margin-top: 0; }
.ohs-h--teal { color: #12a0a0; }
.ohs-body { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.7; color: #444; margin: 0 0 16px; }
.ohs-section { padding: 26px 0; }
.ohs-section:last-of-type { padding-bottom: 80px; }

/* Key Linkages — compact 2-column (badges left, icons right) to cut the tall stacked height */
.ohs-page .env-linkages { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, auto); grid-auto-flow: column; gap: 20px 44px; }

/* quote on white background (icon placeholder + coloured bold text) */
.ohs-quote { display: flex; gap: 20px; align-items: flex-start; margin: 42px 0 6px; }
.ohs-quote .ohs-qmark { width: 60px; height: 46px; min-height: 0; flex: none; }
.ohs-quote p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 20px; line-height: 1.5; color: #1c7fc2; margin: 0; }

/* ISO certification box */
.ohs-iso { border: 1px solid #bcdcef; background: #eaf5fc; padding: 20px 24px; text-align: center; margin: 6px 0 10px; }
.ohs-iso-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; color: #1a1a1a; margin: 0 0 4px; }
.ohs-iso-sub { font-family: 'Noto Sans', sans-serif; font-size: 15px; color: #333; margin: 0 0 14px; }
.ohs-iso-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 600; color: #0e6ab5; margin: 0; }

/* Safety Architecture — four cards in one line, full-width header band */
.ohs-arch { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 6px 0 4px; align-items: stretch; }
.ohs-card { border: 1px solid #cfe3f2; }
.ohs-card-tab { display: block; background: #e7eef5; border-bottom: 3px solid #12a0a0; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; padding: 11px 20px; }
.ohs-card-body { padding: 16px 20px; }
.ohs-card-body p { font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.6; color: #333; margin: 0; }

/* inline teal link */
.ohs-link { display: inline-flex; align-items: center; gap: 8px; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 700; color: #12a0a0; margin-top: 14px; }
.ohs-link i { color: #12a0a0; }

/* blue-square bullet list */
.ohs-blist { margin: 0 0 8px; padding-left: 0; list-style: none; }
.ohs-blist li { position: relative; padding-left: 18px; font-family: 'Noto Sans', sans-serif; font-size: 15px; line-height: 1.6; color: #333; margin-bottom: 10px; }
.ohs-blist li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; background: #2ba6e0; }
.ohs-blist li:last-child { margin-bottom: 0; }

/* Key Safety Initiatives box */
.ohs-box { border: 1px solid #bcdcef; background: #f2f9fd; padding: 26px 28px; margin-top: 26px; }
.ohs-box .ohs-h { margin-top: 0; }

/* Safety Performance table — cyan FY26 (last) column */
.ohs-table-wrap { overflow-x: auto; }
.ohs-table { width: 100%; min-width: 620px; border-collapse: collapse; border-top: 2px solid #12a0a0; border-bottom: 2px solid #12a0a0; }
.ohs-table th { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; color: #1a1a1a; padding: 12px 16px; border-bottom: 2px solid #12a0a0; }
.ohs-table td { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #333; padding: 12px 16px; border-bottom: 1px solid #e6eef4; }
.ohs-table th:first-child, .ohs-table td:first-child { width: 52%; text-align: left; }
.ohs-table th:not(:first-child), .ohs-table td:not(:first-child) { text-align: center; width: 16%; }
.ohs-table th:last-child { background: #2ba6e0; color: #fff; }
.ohs-table td:last-child { background: #eaf6fc; font-weight: 700; color: #1a1a1a; }

/* footnote */
.ohs-note { font-family: 'Noto Sans', sans-serif; font-size: 12.5px; line-height: 1.6; color: #666; margin: 14px 0 0; }

/* shared Social-page heading + quote variants */
.ohs-h--black { color: #1a1a1a; }
.ohs-quote--green p { color: #6f8f3f; }

/* ============================================================
   INNER PAGE — Responsible Supply Chain (.rsc-, uses .ohs-page base)
   ============================================================ */
.rsc-boxh { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 0 0 12px; }
/* ESG Risk Screening — three colour-coded category cards in one row */
.rsc-esg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 10px 0 4px; align-items: stretch; }
.rsc-esg-card { border: 1px solid #d5e0e8; }
.rsc-esg-head { text-align: center; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .5px; padding: 11px 12px; }
.rsc-esg-body { padding: 16px 18px; }
.rsc-esg-body ul { margin: 0; padding-left: 0; list-style: none; }
.rsc-esg-body li { position: relative; padding-left: 16px; font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.5; color: #333; margin-bottom: 9px; }
.rsc-esg-body li:last-child { margin-bottom: 0; }
.rsc-esg-body li::before { content: ""; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; }
.rsc-esg-card--e { border-color: #63a63f; } .rsc-esg-card--e .rsc-esg-head { background: #63a63f; } .rsc-esg-card--e li::before { background: #63a63f; }
.rsc-esg-card--s { border-color: #22a5d6; } .rsc-esg-card--s .rsc-esg-head { background: #22a5d6; } .rsc-esg-card--s li::before { background: #22a5d6; }
.rsc-esg-card--g { border-color: #e1852b; } .rsc-esg-card--g .rsc-esg-head { background: #e1852b; } .rsc-esg-card--g li::before { background: #e1852b; }

/* ============================================================
   INNER PAGE — Corporate Social Responsibility (.csr-, uses .ohs-page base)
   ============================================================ */
.ohs-h--orange { color: #c0562f; }
/* Core Tenets — three icon blocks */
.csr-tenet-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 10px 0 8px; align-items: start; }
.csr-tenet { text-align: center; }
.csr-tenet .img-ph { width: 96px; height: 74px; min-height: 0; margin: 0 auto 12px; }
.csr-tenet p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #0e6ab5; margin: 0; }
/* Vision / Mission / Expanding boxes (reuse .ohs-box + blue headings) */
.csr-h-blue { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 22px; color: #1c7fc2; margin: 0 0 10px; }
.csr-h-blue + .ohs-body + .csr-h-blue { margin-top: 6px; }
.csr-target-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #2f9c6a; margin: 4px 0 12px; }
.csr-tlist { margin: 0; padding: 0; list-style: none; }
.csr-tlist li { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #333; margin-bottom: 10px; }
.csr-tlist li:last-child { margin-bottom: 0; }
/* CSR impact chart placeholders */
.csr-chart { margin-bottom: 20px; }
.csr-chart-row { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 800px) { .csr-chart-row { grid-template-columns: 1fr; gap: 0; } }
.csr-chart-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 0 0 10px; }
.csr-chart .img-ph { width: 100%; min-height: 170px; }
/* blue heading variant */
.ohs-h--blue { color: #1c7fc2; }
/* Stakeholder Consultation table */
.csr-stable-wrap { overflow-x: auto; margin: 8px 0 4px; }
.csr-stable { width: 100%; min-width: 620px; border-collapse: collapse; border-top: 2px solid #12a0a0; border-bottom: 2px solid #12a0a0; }
.csr-stable td { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.55; color: #333; padding: 14px 16px; border-bottom: 1px solid #d7e6ee; vertical-align: top; }
.csr-stable tr:last-child td { border-bottom: none; }
.csr-stable td:first-child { width: 26%; font-weight: 600; color: #1a1a1a; }
.csr-stable ul { margin: 0; padding-left: 0; list-style: none; }
.csr-stable li { position: relative; padding-left: 16px; margin-bottom: 7px; }
.csr-stable li:last-child { margin-bottom: 0; }
.csr-stable li::before { content: ""; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; background: #12a0a0; }
/* CSR intervention block (image + labelled box) */
.csr-intv { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 12px 0; align-items: stretch; }
.csr-intv-fig .img-ph { width: 100%; height: 100%; min-height: 400px; }
.csr-intv-box { background: #d9e9f4; }
.csr-intv-tab { display: block; margin-left: auto; width: max-content; background: #1c7fc2; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; padding: 9px 22px; }
.csr-intv-tab--edu { background: #2ba6e0; }
.csr-intv-body { padding: 22px 28px 26px; }
.csr-intv-body p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.7; color: #333; margin: 0 0 14px; }
.csr-intv-body p:last-child { margin: 0; }
.csr-intv-body .ohs-blist { margin-top: 12px; }
.csr-intv-body .ohs-blist li { font-size: 14px; }
.csr-intv-body p.csr-intv-sub { font-weight: 700; color: #1a1a1a; margin: 8px 0 2px; }
/* blue-teal section heading with left bar (Mangal Seva / National Building) */
.csr-barh { position: relative; padding-left: 16px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 20px; color: #1c8fc4; margin: 6px 0 14px; line-height: 1.25; }
.csr-barh::before { content: ""; position: absolute; left: 0; top: 3px; bottom: 3px; width: 5px; background: #1c8fc4; }
/* bordered outcome stat box */
.csr-outcome-box { display: inline-block; border: 1px solid #b7cc93; background: #fbfdf7; padding: 18px 26px; margin-top: 12px; }
.csr-outcome-label { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 8px; }
/* Story of Change heading (blue, left bar) */
.csr-story-h { position: relative; padding-left: 16px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; line-height: 1.25; margin: 0 0 16px; }
.csr-story-h::before { content: ""; position: absolute; left: 0; top: 2px; bottom: 2px; width: 5px; background: #2ba6e0; }
.csr-story-h1 { display: block; color: #0e4f8c; }
.csr-story-h2 { display: block; color: #4fa8de; }
/* Story of Change outline box (light blue) */
.csr-story-box { border: 1px solid #a9d0ec; padding: 26px 28px; }
/* intervention lead paragraph (bold grey) + health tab blue */
.csr-intv-body p.csr-intv-lead { font-weight: 700; color: #5f6b72; }
.csr-intv-tab--health { background: #1c7fc2; }

/* ============================================================
   INNER PAGE — Corporate Governance (.gov-, orange theme; reuses
   .ohs-section/.ohs-body/.ohs-blist/.ohs-quote + perf-grid + env-linkages)
   ============================================================ */
.gov-page .pep-hero { background: #bf5a1e; }
.gov-page .pep-eyebrow { color: #ffe0cc; }
.gov-page .pep-subtitle { color: #ffe8db; }
/* Two-column chapter-opener hero (text left, GIF right) */
.gov-page .pep-hero.gov-hero { min-height: 0; display: block; background: #fdeee1; }
.gov-page .gov-hero .pep-eyebrow { color: #1a1a1a; }
.gov-page .gov-hero .pep-title { color: #d2691e; }
.gov-page .gov-hero .pep-subtitle { color: #5a4636; }
.gov-page .gov-hero .container { padding-top: 130px; padding-bottom: 0; }
.gov-hero-row { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; align-items: end; }
.gov-hero-text { align-self: center; padding: 10px 0 46px; }
.gov-hero-fig { align-self: end; }
.gov-hero-fig img { width: 100%; display: block; }
@media (max-width: 900px) {
    .gov-hero-row { grid-template-columns: 1fr; gap: 16px; }
    .gov-hero-text { padding: 0 0 20px; }
}
/* orange gradient numbers */
.gov-page .perf-num { font-size: 34px; line-height: 1.15; background: linear-gradient(90deg, #f0912f 0%, #e07a26 45%, #c85f1c 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
/* compact 2-col Key Linkages */
.gov-page .env-linkages { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, auto); grid-auto-flow: column; gap: 20px 44px; }
.gov-page .ohs-quote p { color: #c85f1c; }
.gov-page .ohs-blist li::before { background: #d2691e; }
.gov-page .perf-metric p::before { background: #d2691e; }
/* headings */
.gov-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #d2691e; margin: 30px 0 12px; }
.ohs-section > .container > .gov-h:first-child { margin-top: 0; }
.gov-h--green { color: #2f9c6a; }
.gov-h--black { color: #1a1a1a; }
.gov-h--blue { color: #1c8fc4; }
/* orange band label */
.gov-label { display: inline-block; background: #e07a26; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; padding: 8px 20px; margin: 22px 0 16px; }
/* Focus Areas — arc icon row */
.gov-focus-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin: 8px 0; align-items: start; }
.gov-focus { text-align: center; }
.gov-focus .img-ph { width: 92px; height: 66px; min-height: 0; margin: 0 auto 12px; }
.gov-focus p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1c8fc4; margin: 0; }
/* label + bullets rows (Three Pillars) */
.gov-lbrow { display: grid; grid-template-columns: 210px 1fr; gap: 24px; align-items: stretch; border-bottom: 1px solid #eadfd6; padding-bottom: 16px; margin-bottom: 16px; }
.gov-lbrow:last-child { border-bottom: none; margin-bottom: 0; }
.gov-lbrow-label { background: #fbeee4; padding: 14px 16px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; display: flex; align-items: center; }
/* governance comparison table */
.gov-table-wrap { overflow-x: auto; margin: 6px 0; }
.gov-table { width: 100%; min-width: 680px; border-collapse: collapse; }
.gov-table th { background: #e07a26; color: #fff; text-align: left; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; padding: 12px 16px; }
.gov-table td { font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.5; color: #333; padding: 12px 16px; border-bottom: 1px solid #eadfd6; vertical-align: top; }
.gov-table td:first-child { font-weight: 700; color: #1a1a1a; width: 26%; }
.gov-table td:nth-child(2) { color: #9a8a76; }
.gov-table td:nth-child(3) { color: #cf6a2a; }
.gov-table td { background: #fbe3d1; }
/* Board & committees org chart */
.gov-orgtop { position: relative; text-align: center; background: #e07a26; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; padding: 12px 20px; max-width: 340px; margin: 10px auto 0; }
.gov-orgtop::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); width: 2px; height: 24px; background: #e07a26; }
.gov-comm-grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; margin-top: 46px; }
.gov-comm-grid::before { content: ""; position: absolute; top: -22px; left: calc(25% - 5.5px); right: calc(25% - 5.5px); height: 2px; background: #e07a26; }
.gov-comm { position: relative; border: 1px solid #eadfd6; background: #fdf6f0; padding: 20px 22px; }
.gov-comm::before { content: ""; position: absolute; top: -22px; left: 50%; transform: translateX(-50%); width: 2px; height: 22px; background: #e07a26; }
.gov-comm h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; margin: 0 0 12px; }
.gov-comm ul { margin: 0; padding-left: 0; list-style: none; }
.gov-comm li { position: relative; padding-left: 16px; font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.5; color: #333; margin-bottom: 9px; }
.gov-comm li:last-child { margin-bottom: 0; }
.gov-comm li::before { content: ""; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; background: #d2691e; }
.gov-comm li i { display: block; font-size: 12.5px; color: #888; font-style: italic; }
/* snapshot separators */
.gov-snaprow { border-bottom: 1px solid #eadfd6; padding-bottom: 20px; margin-bottom: 22px; }
/* orange callout box (Annual Anti-Corruption Statement) */
.gov-obox { background: #fdeee2; border: 1px solid #f2c9a8; padding: 22px 26px; margin-top: 22px; box-shadow: 0 8px 20px rgba(0,0,0,.06); }
.gov-obox h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #d2691e; margin: 0 0 10px; }
.gov-obox p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.65; color: #d2691e; margin: 0; }

/* ============================================================
   INNER PAGE — Cyber Security and Data Privacy (.cyb-, orange theme,
   banner image on RHS; reuses .gov-page base for orange gradient nums)
   ============================================================ */
/* hero — text left, image right (RHS banner) */
.cyb-hero { background: #bf5a1e; }
.cyb-hero .container { padding-top: 130px; padding-bottom: 46px; }
.cyb-hero-row { display: grid; grid-template-columns: 1.05fr 1fr; gap: 46px; align-items: center; }
.cyb-hero-txt .pep-title { color: #ffffff; }
.cyb-hero-txt .pep-subtitle { color: #ffe8db; max-width: none; }
.cyb-hero-fig .img-ph { width: 100%; min-height: 340px; }
/* green section headings + green bullets (cyber page) */
.cyb-page .ohs-blist li::before { background: #6a8f3c; }
/* Approach — three orange-topped boxes */
.cyb-approach { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin: 10px 0 4px; align-items: stretch; }
.cyb-abox { border-top: 3px solid #e07a26; background: #fbf4ee; padding: 20px 22px; }
.cyb-abox p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #444; margin: 0; }
/* orange category label (Foundational Framework, etc.) */
.cyb-cat { background: #fbe3d1; color: #d2691e; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; padding: 10px 16px; margin: 20px 0 14px; }
.cyb-subh { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; margin: 0 0 6px; }

/* ============================================================
   INNER PAGE — Board of Directors profiles (.bod-, orange theme)
   ============================================================ */
.bod-hero { background: #bf5a1e; }
.bod-hero .container { padding-top: 130px; padding-bottom: 44px; }
.bod-hero .pep-title { color: #ffffff; }
.bod-hero .pep-eyebrow { color: #ffe0cc; }
/* director card */
.bod-card { border-bottom: 2px solid #eadfd6; padding-bottom: 40px; margin-bottom: 40px; }
.bod-card:last-child { border-bottom: none; margin-bottom: 0; }
.bod-top { display: grid; grid-template-columns: 260px 1fr; gap: 40px; align-items: start; margin-bottom: 8px; }
.bod-photo .img-ph { width: 100%; min-height: 300px; }
.bod-name { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #1a1a1a; margin: 16px 0 8px; }
.bod-age { display: inline-block; background: #e07a26; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 13px; padding: 5px 14px; }
.bod-nat { font-family: 'Noto Sans', sans-serif; font-size: 14px; color: #555; margin: 10px 0 0; }
.bod-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; color: #12a0a0; margin: 22px 0 10px; }
.bod-intro .bod-h:first-child { margin-top: 0; }
.bod-field { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.6; color: #333; margin: 0 0 10px; }
.bod-field b { color: #1a1a1a; }
/* directorships table */
.bod-table-wrap { overflow-x: auto; margin: 6px 0 4px; }
.bod-table { width: 100%; min-width: 680px; border-collapse: collapse; border-top: 2px solid #e07a26; border-bottom: 2px solid #e07a26; }
.bod-table th { background: #c0562f; color: #fff; text-align: left; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 12.5px; padding: 11px 14px; vertical-align: top; }
.bod-table td { font-family: 'Noto Sans', sans-serif; font-size: 13px; line-height: 1.5; color: #333; padding: 10px 14px; border-bottom: 1px solid #eadfd6; vertical-align: top; }
.bod-table td.bod-rel { background: #fdf6f0; color: #444; }
.bod-email { font-family: 'Noto Sans', sans-serif; font-size: 15px; font-weight: 600; color: #e07a26; }

/* ============================================================
   INNER PAGE — Global Tax and Other Contributions (.gtx-, blue banner + green accents)
   ============================================================ */
.gtx-page { --perf-green: #009878; }
/* banner (investment-case style: dark title + image right) + blue lead panel */
.gtx-lead-panel { background: #0f9fd6; padding: 42px 50px; }
.gtx-lead-panel p { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 17px; line-height: 1.6; color: #fff; margin: 0; }
/* headings */
.gtx-h { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 18px; color: #009878; margin: 30px 0 14px; }
.ohs-section > .container > .gtx-h:first-child { margin-top: 0; }
.gtx-page .ohs-blist li::before { background: #009878; }
/* Principles — green-gradient label + description rows */
.gtx-prin { display: grid; grid-template-columns: 210px 1fr; gap: 30px; align-items: start; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #d3e6e0; }
.gtx-prin:last-child { border-bottom: none; }
.gtx-prin-label { background: linear-gradient(135deg, #2e6b3e 0%, #7ba53f 100%); color: #fff; padding: 16px 18px; display: flex; align-items: center; gap: 12px; min-height: 70px; }
.gtx-prin-num { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 26px; line-height: 1; color: #d3e8a6; }
.gtx-prin-title { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; line-height: 1.3; }
.gtx-prin-body p { font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.7; color: #333; margin: 0 0 12px; }
.gtx-prin-body p:last-child { margin: 0; }
/* Tax Risk Management */
.gtx-risk-banner { display: inline-block; background: linear-gradient(135deg, #3a8f7a, #7bbf8f); color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; padding: 12px 28px; margin: 6px 0 22px; }
.gtx-risk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 36px; }
.gtx-risk { display: grid; grid-template-columns: 34px 1fr; gap: 10px; border-top: 1px solid #cde3dc; padding-top: 12px; }
.gtx-risk-n { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 22px; color: #5aa17e; line-height: 1; }
.gtx-risk h4 { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #009878; margin: 0 0 6px; }
.gtx-risk p { font-family: 'Noto Sans', sans-serif; font-size: 13.5px; line-height: 1.55; color: #444; margin: 0; }
/* Country-wise table */
.gtx-unit { text-align: right; font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #555; margin: 0 0 6px; }
.gtx-table-wrap { overflow-x: auto; }
.gtx-table { width: 100%; min-width: 780px; border-collapse: collapse; }
.gtx-table th { background: #5cb3a0; color: #fff; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 12px; padding: 9px 10px; text-align: center; border: 1px solid #fff; vertical-align: middle; }
.gtx-table td { font-family: 'Noto Sans', sans-serif; font-size: 12.5px; color: #333; padding: 9px 10px; text-align: center; border-bottom: 1px solid #e0e6e4; }
.gtx-table td:first-child { text-align: left; }
.gtx-table tr.gtx-total td { font-weight: 700; border-top: 2px solid #5cb3a0; }
.gtx-note { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #333; margin: 12px 0 0; }
/* Exchequer box */
.gtx-exch { border: 1px solid #cfe6df; max-width: 560px; margin: 8px 0; }
.gtx-exch-top { background: #e7f4ef; text-align: center; padding: 22px; }
.gtx-exch-big { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 30px; color: #009878; }
.gtx-exch-big span { font-size: 16px; }
.gtx-exch-cap { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #555; margin-top: 4px; }
.gtx-exch-row { display: grid; grid-template-columns: 1fr 1fr; }
.gtx-exch-cell { padding: 18px 20px; text-align: center; border-top: 1px solid #d6e8e1; }
.gtx-exch-cell:nth-child(2) { border-left: 1px solid #d6e8e1; }
.gtx-exch-cell--full { grid-column: 1 / -1; }
.gtx-exch-num { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 19px; color: #009878; }
.gtx-exch-pct { font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 16px; color: #1a1a1a; margin-top: 2px; }
.gtx-exch-lbl { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #444; margin-top: 4px; }
/* State-wise contributions grid */
.gtx-states { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #e0e6e4; border-left: 1px solid #e0e6e4; margin: 8px 0; }
.gtx-state { display: grid; grid-template-columns: 56px 1fr; gap: 12px; align-items: center; padding: 16px 14px; border-bottom: 1px solid #e0e6e4; border-right: 1px solid #e0e6e4; }
.gtx-state .img-ph { width: 56px; height: 46px; min-height: 0; }
.gtx-state-num { font-family: 'Noto Sans', sans-serif; font-weight: 800; font-size: 22px; color: #009878; line-height: 1.1; }
.gtx-state-name { font-family: 'Noto Sans', sans-serif; font-size: 13px; color: #333; }
.gtx-mapnote { text-align: right; font-family: 'Noto Sans', sans-serif; font-size: 12.5px; color: #888; margin: 12px 0 0; }
/* Contribution-wise snapshot flow */
.gtx-snap-total { position: relative; max-width: 360px; margin: 10px auto 0; background: #e7f4ef; text-align: center; padding: 16px 20px; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; color: #1a1a1a; }
.gtx-snap-total::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); width: 2px; height: 28px; background: #5cb3a0; }
.gtx-snap-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 56px; align-items: start; }
.gtx-snap-grid::before { content: ""; position: absolute; top: -28px; left: calc((100% - 48px) / 6); right: calc((100% - 48px) / 6); height: 2px; background: #5cb3a0; }
.gtx-snap-box { position: relative; border: 1px solid #cfe6df; }
.gtx-snap-box::before { content: ""; position: absolute; top: -28px; left: 50%; transform: translateX(-50%); width: 2px; height: 28px; background: #5cb3a0; }
.gtx-snap-head { background: #5cb3a0; color: #fff; padding: 12px 16px; }
.gtx-snap-head span { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 15px; }
.gtx-snap-head small { display: block; font-family: 'Noto Sans', sans-serif; font-size: 14px; font-weight: 700; margin-top: 2px; }
.gtx-snap-body { padding: 16px 18px; }
.gtx-snap-item { margin-bottom: 14px; }
.gtx-snap-item:last-child { margin-bottom: 0; }
.gtx-snap-item b { display: block; font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 14px; color: #1a1a1a; }
.gtx-snap-item span { font-family: 'Noto Sans', sans-serif; font-size: 13.5px; color: #009878; }
.growth-block-sub {
    font-family: 'Noto Sans', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    color: #111111;
    margin-bottom: 22px;
}
.growth-block-title + .growth-block-sub {
    margin-top: -18px;
}
.bm-out-num span
{
    font-size: 16px;
}
.bm-out1
{
margin-bottom: 10px;
}

/* Output stat with a leading icon */
.bm-out-ic {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin-right: 0;
}
.bm-out-ico {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    object-fit: contain;
    display: block;
}
.bm-out-txt { flex: 1; min-width: 0; }
.bm-out-ic .bm-out-lbl { margin-top: 2px; }

/* Business Model — Input/Outcomes lists scroll when long (right-side thin bar) */
.scroll-text-new { overflow-y:auto; overflow-x:hidden; padding-right:10px!important; max-height:105px; }
.scroll-text-new::-webkit-scrollbar { width:3px; }
.scroll-text-new::-webkit-scrollbar-track { border-radius:0; background-color:rgba(255,255,255,.2); }
.scroll-text-new::-webkit-scrollbar-thumb { border-radius:0; background-color:rgba(255,255,255,.85); }

.footer-credit a, .footer-credit
{
    color: #ffffff;
}