.yugpravartak-page {
            color: var(--hi-ink);
            background: var(--bg);
        }

        /* tall composite portrait — frame Maa above, भैया जी below */
        .yugpravartak-page .page-hero__bg {
            object-position: center 30%;
        }

        .yug-reasons {
            position: relative;
            z-index: 2;
        }

        .yug-reasons__grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 12px;
            padding: 14px;
            border: 1px solid rgba(121, 43, 42, .13);
            border-radius: 8px;
            background: rgba(255, 252, 246, .94);
            box-shadow: 0 24px 70px rgba(63, 45, 37, .12);
        }

        .yug-reason-card {
            min-height: 156px;
            padding: 20px;
            border-radius: 8px;
            background: linear-gradient(180deg, rgba(244, 230, 209, .62), rgba(255, 250, 241, .96));
        }

        .yug-reason-card span {
            display: inline-flex;
            margin-bottom: 10px;
            padding: 5px 10px;
            color: #fffaf3;
            border-radius: 999px;
            background: var(--hi-maroon);
            font-size: .78rem;
            font-weight: 900;
        }

        .yug-reason-card h2 {
            margin: 0 0 8px;
            color: var(--hi-ink);
            font-family: var(--hi-serif);
            font-size: 1.28rem;
            line-height: 1.35;
        }

        .yug-reason-card p {
            margin: 0;
            color: #69574f;
            font-size: .95rem;
            line-height: 1.65;
        }

        .yug-section {
            padding-block: clamp(70px, 8vw, 116px);
            scroll-margin-top: 136px;
        }

        .yug-section--surrender { background: var(--bg);}
        .yug-section--knowledge { background: var(--bg);}
        .yug-section--diary { background: var(--bg);}
        .yug-section--service { background: var(--bg);}
        .yug-section--education { background: var(--bg);}
        .yug-section--sadhna { background: var(--bg);}
        .yug-section--legacy { background: var(--bg);}

        .yug-grid {
            display: grid;
            grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
            gap: clamp(30px, 6vw, 76px);
            align-items: start;
        }

        .yug-grid--reverse .yug-media {
            order: 2;
        }

        .yug-media {
            margin: 0;
            overflow: hidden;
            border: 1px solid rgba(198, 148, 53, .28);
            border-radius: 8px;
            background: rgba(255, 250, 241, .72);
            box-shadow: 0 24px 64px rgba(63, 45, 37, .13);
        }

        .yug-media img {
            display: block;
            width: 100%;
            height: clamp(330px, 40vw, 560px);
            object-fit: cover;
        }

        .yug-media--contain {
            display: grid;
            place-items: center;
            padding: clamp(18px, 3vw, 34px);
            background: rgba(255, 252, 246, .62);
        }

        .yug-media--contain img {
            width: min(100%, 360px);
            height: clamp(380px, 46vw, 560px);
            object-fit: contain;
            filter: drop-shadow(0 22px 34px rgba(63, 45, 37, .22));
        }

        .yug-media figcaption {
            padding: 12px 16px 14px;
            color: #6d5d53;
            background: rgba(255, 250, 241, .92);
            font-size: .92rem;
            font-weight: 700;
            line-height: 1.55;
        }

        .yug-copy h2 {
            margin: 10px 0 20px;
            color: var(--hi-ink);
            font-family: var(--hi-serif);
            font-size: clamp(2.1rem, 4.6vw, 4.45rem);
            line-height: 1.16;
            letter-spacing: 0;
        }

        .yug-copy p {
            margin: 0 0 16px;
            color: #62544c;
            font-size: clamp(1.02rem, 1.28vw, 1.16rem);
            line-height: 1.9;
        }

        .yug-copy strong {
            color: var(--hi-maroon);
        }

        .yug-emphasis {
            margin-top: 24px;
            padding: 22px 24px;
            color: #4f403b;
            border-left: 4px solid var(--hi-gold);
            border-radius: 8px;
            background: rgba(255, 252, 246, .8);
            font-family: var(--hi-serif);
            font-size: clamp(1.08rem, 1.45vw, 1.3rem);
            font-weight: 700;
            line-height: 1.76;
        }

        .yug-quote {
            margin-top: 24px;
            padding: clamp(26px, 4vw, 42px);
            border: 1px solid var(--hi-quote-border);
            border-radius: 8px;
            background:
                radial-gradient(circle at 16% 0%, rgba(221, 236, 240, .72), transparent 34%),
                var(--hi-quote-bg);
            box-shadow: 0 22px 56px rgba(121, 43, 42, .1);
        }

        .yug-quote blockquote {
            margin: 0;
            color: var(--hi-ink);
            font-family: var(--hi-serif);
            font-size: clamp(1.35rem, 2.1vw, 1.9rem);
            font-weight: 700;
            line-height: 1.72;
        }

        .yug-quote cite {
            display: block;
            margin-top: 16px;
            color: var(--hi-quote-muted);
            font-style: normal;
            font-weight: 800;
        }

        .yug-pill-list {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 22px;
        }

        .yug-pill-list span {
            display: inline-flex;
            align-items: center;
            min-height: 38px;
            padding: 7px 13px;
            color: var(--hi-maroon);
            border: 1px solid rgba(121, 43, 42, .16);
            border-radius: 999px;
            background: rgba(255, 250, 241, .78);
            font-weight: 800;
            line-height: 1.35;
        }

        .yug-closing {
            text-align: center;
            background:
                radial-gradient(circle at 50% 0%, rgba(198, 148, 53, .18), transparent 36%),
                linear-gradient(180deg, #fffaf1 0%, #f4e6d2 100%);
        }

        .yug-closing .hi-section-heading {
            max-width: 1040px;
        }

        @media (max-width: 980px) {

            .yug-reasons__grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .yug-grid {
                grid-template-columns: 1fr;
            }

            .yug-grid--reverse .yug-media {
                order: 0;
            }
        }

        @media (max-width: 640px) {

            .yug-reasons {
                margin-top: 0;
            }

            .yug-reasons__grid {
                grid-template-columns: 1fr;
            }

            .yug-section {
                scroll-margin-top: 126px;
            }

            .yug-media img {
                height: 360px;
            }

            .yug-media--contain img {
                height: min(70vh, 430px);
            }
        }
