/* Scope layout changes to the two columns inside the supplied MegaPets page. */
.mp-about:has(> .mpwk-layout) { container: mpwk-about / inline-size; }
.mp-about .mpwk-layout {
    --mpwk-top: var(--mp-site-header-sticky-offset-desktop, 80px);
    margin-block: clamp(26px, 4vw, 54px);
    min-width: 0;
}
.mpwk-layout > .mpwk-copy, .mpwk-layout > .mpwk-slot { min-width: 0; }
.mpwk-layout .mp-about__values { margin-top: 0; }
@media (min-width: 1121px) {
  @container mpwk-about (min-width: 850px) {
    .mp-about .mpwk-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) clamp(340px, 31vw, 410px);
        gap: clamp(32px, 4.4vw, 68px);
        align-items: start;
    }
    .mpwk-layout > .mpwk-slot { position: sticky; top: var(--mpwk-top); }
    .mpwk-copy .mp-about__values { grid-template-columns: 1fr; }
    .mpwk-copy .mp-about__value {
        display: grid;
        grid-template-columns: 1.6em minmax(0, 1fr);
        column-gap: clamp(10px, 1.4vw, 16px);
        min-height: 0;
        padding: clamp(16px, 1.8vw, 24px) clamp(18px, 2vw, 28px);
    }
    .mpwk-copy .mp-about__number { grid-row: 1 / 3; margin: 9px 0 0 6px; }
    .mpwk-copy .mp-about__value h2 { margin-bottom: 5px; font-size: clamp(19px, 1.6vw, 22px); }
    .mpwk-copy .mp-about__value p { font-size: 14px; line-height: 1.6; }
    .mpwk-copy .mp-about__value p { grid-column: 2; max-width: 60ch; }
    .mpwk-copy .mp-about__story {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
        padding: clamp(28px, 3vw, 44px) clamp(2px, 1.2vw, 16px) 0;
    }
    .mpwk-copy .mp-about__story h2 { font-size: clamp(26px, 2.4vw, 32px); }
    .mpwk-copy .mp-about__quote { padding: 14px clamp(18px, 2vw, 28px); }
    .mpwk-copy .mp-about__quote p { font-size: clamp(19px, 1.6vw, 22px); }
  }
  @container mpwk-about (max-width: 849.99px) {
    .mpwk-copy .mp-about__values, .mpwk-copy .mp-about__story { grid-template-columns: 1fr; }
    .mpwk-layout > .mpwk-slot { max-width: 470px; margin: 24px auto 0; }
  }
}
@media (max-width: 1120px) {
    .mpwk-layout > .mpwk-slot { position: static; margin-top: clamp(20px, 4vw, 32px); }
}
@media (min-width: 1121px) and (max-height: 550px) {
    .mpwk-layout > .mpwk-slot { position: static; }
}
@media (prefers-reduced-motion: reduce) {
    .mpwk-slot * { scroll-behavior: auto; }
}

/* Only a Poradnik page with both blocks gets this shell. The narrow or
   non-enhanced layout follows their reading order: guides, then films. */
.mpwk-guide-shell { container: mpwk-guide / inline-size; min-width: 0; }
.mpwk-guide-shell > .mpwk-layout--guide {
    --mpwk-top: var(--mp-site-header-sticky-offset-desktop, 80px);
    min-width: 0;
}
.mpwk-layout--guide > .mpwk-copy { container: mpwk-guide-copy / inline-size; }
.mpwk-layout--guide > .mpwk-slot { margin: clamp(24px, 3vw, 48px) auto 0; max-width: 470px; }
.mpwk-layout--guide > .mpwk-slot:not(:has(.mpwk-rail)) { display: none; }
@media (min-width: 1121px) {
    @container mpwk-guide (min-width: 1040px) {
        .mpwk-guide-shell > .mpwk-layout--guide:has(> .mpwk-slot .mpwk-rail) {
            display: grid;
            grid-template-columns: minmax(0, 1fr) clamp(312px, 28cqw, 410px);
            gap: clamp(28px, 3cqw, 56px);
            align-items: start;
            margin-block: clamp(28px, 4vw, 64px);
        }
        .mpwk-layout--guide:has(> .mpwk-slot .mpwk-rail) > .mpwk-copy .mpg-hub { margin-block-start: 0; }
        .mpwk-layout--guide > .mpwk-slot { width: 100%; max-width: none; margin: 0; }
    }
}
@media (min-width: 1121px) and (min-height: 551px) {
    @container mpwk-guide (min-width: 1040px) {
        .mpwk-layout--guide > .mpwk-slot { position: sticky; top: var(--mpwk-top); }
    }
}
/* Mirror the guide plugin's own thresholds inside the available left column. */
@container mpwk-guide-copy (max-width: 840px) {
    .mpwk-layout--guide .mpg-hub__grid { grid-template-columns: minmax(0, 1fr); }
}
@container mpwk-guide-copy (max-width: 720px) {
    .mpwk-layout--guide .mpg-hub__tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: var(--mpg-radius-large); }
}
@container mpwk-guide-copy (max-width: 520px) {
    .mpwk-layout--guide .mpg-card__link { grid-template-columns: 84px minmax(0, 1fr); min-height: 0; }
    .mpwk-layout--guide .mpg-card__symbol { width: 58px; margin-left: 16px; }
    .mpwk-layout--guide .mpg-card__body { padding: 23px 18px; }
}
