.report-impact-section {
	margin-top: 64px;
	border-radius: 8px;
	border: 1px solid #CED4DA;
	background: #F7F8F9;
	padding: 36px 32px 0 32px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}
.impact-header-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.impact-subsection {
	gap: 12px;
	flex-wrap: wrap;
}

.impact-image img {
	width: 60px;
	height: 60px;
}

.impact-text {
	flex: 1;
	min-width: 250px;
}

.impact-title {
	font-size: 28px;
	font-weight: 700;
	color: #101828;
	margin: 0 0 3px 0;
}

.impact-subtitle {
	font-size: 20px;
	font-weight: 500;
	color: #495057;
	margin: 0;
}


/*section 2*/
.obesity-chart-box {
    position: relative;
    border-radius: 8px;
    background: var(--Neutral-50, #F7F8F9);
    padding: 32px 32px 10px 32px;
    margin-top: 32px;
    background-image: url('../images/Vector.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
    box-sizing: border-box;
}
.impact-chart-row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
    justify-content: space-between;
}

.impact-chart-text {
    margin-left: 50px;
    flex: 1 1 220px;
    min-width: 200px;
}

.impact-chart-title {
    font-size: 40px;
    font-weight: 700;
    color: #212529;
    margin: 8px 0 0 0;
}

.impact-chart-group {
    display: flex;
    align-items: center;
    gap: 48px;
    flex: 2 1 300px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.chart-item img {
    width: 157px;
    height: auto;
}

.chart-item {
    text-align: center;
}

.chart-label {
    margin-top: 8px;
    font-size: 18px;
    font-weight: 500;
    color: #343A40;
}
.impact-chart-subtitle {
    margin-bottom: 0;
    font-size: 20px;

}
.impact-chart-title {

}
@media (max-width: 767px) {
    .obesity-chart-box {
        background-image: url('../images/Vector-mobile.png');
    }
    .report-impact-section {
        padding:16px;
        padding-bottom:0;
    }
    .obesity-chart-box {
        padding:0 16px
    }
    .impact-chart-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .impact-chart-text {
        flex:none!important;
        margin-left: 0;
        text-align: left;
        width: 100%;
    }

    .impact-chart-group {
        flex:none !important;
        justify-content: center;
        gap: 16px;
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
        padding-top: 8px;
        padding-bottom: 12px;
        margin-top: 0;
    }

    .chart-item img {
        width: 75px;
        height: auto;
    }

    .chart-item {
        flex: 0 0 auto;
        min-width: 75px;
    }

    .impact-chart-subtitle {
        font-size: 16px;
        margin-bottom: 0;
    }

    .impact-chart-title {
        font-size: 28px;
        margin-top: 4px;
    }
    .chart-label {
        font-size:15px;
    }
}

/* funnel section*/
.funnel-top-text,
.funnel-bottom-text {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin: 32px 0 24px 0;
    line-height: 1.5;
}

.funnel-box {
    background: #D7E7EC;
    padding: 16px 32px 16px 32px;
}

.funnel-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
}

.funnel-left img {
    /*max-width: 340px;*/
    width: 100%;
    height: auto;
}

.funnel-right {
    flex: 1;
    min-width: 250px;
}

.funnel-number {
    font-size: 18px;
    color: #212529;
    margin-bottom: 16px;
}

    .funnel-number .red {
        font-weight: 700;
        color: #C0413B;
        margin-right: 6px;
    }

    .funnel-number .blue {
        font-weight: 700;
        color: #3399B3;
        margin-right: 6px;
    }

@media (max-width: 767px) {
    .funnel-content {
        flex-direction: column;
        gap: 16px;
    }

    .funnel-left img {
        max-width: 100%;
    }

    .funnel-top-text,
    .funnel-bottom-text {
        font-size: 20px;
        text-align: left;
    }
    .funnel-box {
        padding:16px;
    }
    .vertical-label {
        font-size: 12px !important;
    }
    .funnel-heading {
        font-size:16px !important;
    }
    .funnel-value {
        font-size: 24px !important;
    }
    .funnel-number {
        font-size:16px !important;
    }
}
.vertical-label {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    font-size: 14px;
    font-weight: 600;
    color: #495057;
    margin-right: 12px;
    white-space: nowrap;
}

.funnel-left {
    display: flex;
    align-items: center;
}
.funnel-value {
    font-size: 32px;
}
.funnel-dot {
    width: 20px;
    height: 20px;
}
.funnel-line {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-bottom: 4px;
}

.funnel-dot {
    border-radius: 50%;
    display: inline-block;
}
.funnel-heading {
    font-size: 18px;
    font-weight: 500;
    color: #212529;
    margin-bottom: 16px;
}

.funnel-dot {

    margin-right: 6px;
}

.funnel-value {
    font-weight: 700;
    margin-right: 6px;
}

/*next is life expectency section*/
.life-impact-box {
    margin-top: 32px;
    background: #F7F8F9;
    border-radius: 8px;
    padding: 0 ;
}

.life-impact-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 32px;
}

.life-impact-left {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1 1 280px;
    min-width: 250px;
}

    .life-impact-left img {
        width: 100px;
        height: 100px;
    }

.life-impact-text {
    display: flex;
    flex-direction: column;
}

.life-impact-years {
    font-size: 32px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.life-impact-description {
    font-size: 18px;
    color: #495057;
    margin: 0;
}

.life-impact-right {
    flex: 2 1 400px;
    min-width: 260px;
    text-align: center !important;
}

.life-impact-chart-title {
    font-size: 18px;
    font-weight: 500;
    color: #475467;
    margin-bottom: 5px;
    line-height: 1.4;
    text-align: center;
    margin-top: 0;
}

.life-impact-chart {
    width: 75%;
    height: auto;
    margin:auto;
    margin-bottom: 12px;
}

.life-impact-legend {
    display: flex;
    justify-content:center;
    gap: 20px;
    font-size: 14px;
    color: #212529;
    font-weight: 500;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

    .legend-item .dot {
        width: 14px;
        height: 14px;
        border-radius: 50%;
        display: inline-block;
    }

.status-quo {
    background-color: #05445E;
}

.moderate {
    background-color: #3A99AE;
}

.accelerated {
    background-color: #BE5648;
}

@media (max-width: 767px) {
    .vertical-label {
        margin-left: 25px;
    }
    .life-impact-content {
        flex-direction: column;
        gap: 24px;
    }

    .life-impact-left {
        flex-direction: row;
        justify-content: flex-start;
        width: 100%;
    }

    .life-impact-right {
        width: 100%;
        flex:none !important;
    }

    .life-impact-years {
        font-size: 24px;
    }

    .life-impact-description {
        font-size: 15px;
    }

    .life-impact-chart-title {
        font-size: 15px;
    }

    .life-impact-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    .life-impact-chart {
        width: 100%;
        height: auto;
    }
    .life-impact-box {
        padding: 0 0 0 0;
    }
    .legend-item {
        font-size: 13px;
        margin: auto;
    }
    .life-impact-left {
        flex:none;

    }
}

/*Next is healtcare savings section */
.savings-impact-box {
    background: #F7F8F9;
    padding: 16px 32px 24px 32px;
    border-radius: 24px;
    border: 1px solid  #DEE2E6;
}

.savings-impact-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 32px;
}

.savings-impact-left img {
    width: 95%;
    height: auto;
}
.savings-impact-left {
    flex:2;
}
.savings-impact-right {
    flex: 1 1 300px;
}

.savings-impact-label {
    font-size: 18px;
    color: #475467;
    font-weight: 500;
    margin-bottom: 6px;
}

.savings-impact-value {
    font-size: 32px;
    font-weight: 700;
    color: #212529;
    margin: 0 0 8px 0;
}

.savings-impact-description {
    font-size: 18px;
    color: #495057;
    margin: 0;
    line-height: 1.5;
}

@media (max-width: 767px) {
    .savings-impact-content {
        flex-direction: column;
        gap: 16px;
    }
    .savings-impact-right {
        flex:none;
    }
    .savings-impact-left img {
        max-width: 100%;
    }

    .savings-impact-right {
        width: 100%;
    }

    .savings-impact-label {
        font-size: 16px;
    }

    .savings-impact-value {
        font-size: 24px;
    }

    .savings-impact-description {
        font-size: 16px;
    }
    .savings-impact-box {
        padding: 16px !important;
    }
}

.desktop-img {
    display: block;
}

.mobile-img {
    display: none;
}
@media (max-width: 767px) {
    .desktop-img {
        display: none;
    }

    .mobile-img {
        display: block;
    }
}


/*footer section*/
.report-footer {
    padding-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.report-footer__sources p {
    margin: 0 0 8px;
    font-size: 16px;
    color: #495057;
}

.report-footer__actions {
    background: #F0F2F4;
    padding: 16px 32px;
    margin-left: -32px;
    width: calc(100%);
    border-radius: 0 0 8px 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;

}

.report-footer__buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.footer-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1.5px solid #0C5E79;
    padding: 10px 12px 10px 16px;
    font-size: 18px;
    font-weight: 600;
    color: #0C5E79;
    text-decoration: none;
    background: transparent;
    transition: all 0.2s ease-in-out;
}

    .footer-button:hover {
        background: rgba(12, 94, 121, 0.10);
    }

.back-to-iceberg {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #0C5E79;
    font-weight: 600;
    font-size: 18px;
    text-decoration: none;
}

.back-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #3A99AE;
    border-radius: 1000px;
}
@media (max-width: 768px) {
    .report-footer__actions {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
        margin-left: -16px;
    }

    .back-to-iceberg {
        align-self: flex-start;
    }
    .footer-button, .back-to-iceberg {
        font-size: 14px;
    }
    .back-icon {
        width:32px;
        height:32px;
    }
}
.report-divider {
    height: 1px;
    background-color: #CED4DA;
    margin-top: 32px;
    width: 100%;
}
.report-footer-copyright {
    text-align: center;
    font-size: 14px;
    color: #6C757D;
    margin: 32px auto 0;
    padding-bottom: 32px;
}

.report-title-highlight {
    border-radius: 8px;
    background: #E9ECEF;
    padding: 12px 16px;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    color: #0C5E79
}


@media (max-width: 768px) {
    .report-title-highlight {
        font-size: 24px ;
    }
}

.center-image {
    margin:auto;
}
.no-padding {
    padding:0 !important;
}

@media (min-width: 769px) and (max-width: 1024px) {
    .impact-chart-group {
    align-items: center;
    gap: 24px;
    flex: 3;
    justify-content: center;
    }
    .impact-chart-text {
        flex: 1;
        min-width: 0;
    }
    .funnel-left {
        display: flex;
        align-items: center;
        flex: 2;
    }
    .funnel-right {
        flex: 1;
    }
    .funnel-content {
        gap:24px;
    }
    .funnel-top-text, .funnel-bottom-text {
        font-size: 22px !important;
    }
    .life-impact-years {
        font-size:28px;
    }
    .impact-chart-subtitle {
        font-size: 18px;
    }
    .report-impact-section {
    padding:24px 24px 0 24px;
}
.report-footer__actions {
    padding:16px 24px;
    margin-left: -24px;
}
}


.savings-impact-right {
    flex: 2 !important;
}
.funnel-image {
    transform: translate(-29px, -0);
}
.funnel-image-mobile {
    transform: translate(-25px, 0);
}
.overflow-hide {
    overflow: hidden;
}
.full-width {
    width:100% !important;
}