.about-mosaic__tile { opacity: 0; transform: translateY(1.5rem); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2, .8, .2, 1), box-shadow 300ms ease; }
.about-mosaic.is-visible .about-mosaic__tile { opacity: 1; transform: none; }

.about-mosaic__caption { font-size: .875rem; line-height: 1.25rem; }
.about-mosaic__link i { transition: transform 250ms ease; }
.about-mosaic__link:hover i { transform: translateX(.25rem); }

.about-mosaic__area { aspect-ratio: 5 / 2; cursor: crosshair; touch-action: pan-y; }
.about-mosaic__area svg, .about-mosaic__mini svg { display: block; width: 100%; height: 100%; overflow: visible; }
.about-mosaic__area text { font-size: 12px; font-weight: 700; }
.about-mosaic__mini { height: 4.5rem; }

.about-mosaic__draw { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1600ms cubic-bezier(.2, .8, .2, 1) 300ms; }
.about-mosaic__fade { opacity: 0; transition: opacity 900ms ease 900ms; }
.about-mosaic__col { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform 900ms cubic-bezier(.2, .8, .2, 1); }
.about-mosaic__seg { transform-box: fill-box; transform-origin: 0 50%; transform: scaleX(0); transition: transform 700ms cubic-bezier(.2, .8, .2, 1); }
.about-mosaic__arc { transition: stroke-dashoffset 1500ms cubic-bezier(.2, .8, .2, 1) 300ms; }
.about-mosaic__needle { transition: transform 1500ms cubic-bezier(.3, 1.3, .4, 1) 300ms; }
.about-mosaic__pulse { transform-box: fill-box; transform-origin: center; animation: about-mosaic-pulse 2.2s ease-out infinite; }
.about-mosaic__cursor { opacity: 0; transition: opacity 200ms ease; }
.about-mosaic__area.is-hover .about-mosaic__cursor { opacity: 1; }

.is-drawn .about-mosaic__draw { stroke-dashoffset: 0; }
.is-drawn .about-mosaic__fade { opacity: 1; }
.is-drawn .about-mosaic__col, .is-drawn .about-mosaic__seg { transform: none; }

@keyframes about-mosaic-pulse { 0% { transform: scale(1); opacity: .5; } 100% { transform: scale(3.2); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
    .about-mosaic__tile, .about-mosaic__draw, .about-mosaic__fade, .about-mosaic__col, .about-mosaic__seg, .about-mosaic__arc, .about-mosaic__needle { transition: none; }
    .about-mosaic__tile { opacity: 1; transform: none; }
    .about-mosaic__pulse { animation: none; opacity: 0; }
}

.about-mosaic__tip, .about-mosaic__dot { opacity: 0; pointer-events: none; transition: opacity 200ms ease; white-space: nowrap; }
.about-mosaic__dot { width: 1rem; height: 1rem; }
.about-mosaic__area.is-hover .about-mosaic__tip, .about-mosaic__area.is-hover .about-mosaic__dot { opacity: 1; }

/* wpg-hidden: utility classes are renamed in production builds, so hidden states must not rely on .hidden / .d-none alone */
.about-mosaic[hidden], .about-mosaic [hidden], .about-mosaic .hidden.d-none { display: none !important; }

/* value + unit suffix stay inside their card: smaller suffix, long words may break */
.about-mosaic__suffix { font-size: .55em; margin-left: .1em; }
.about-mosaic :has(> .about-mosaic__suffix) { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }

.newspaper-columns-timeline__dropcap::first-letter {
    float: left;
    font-size: 4em;
    font-weight: 900;
    line-height: 0.75;
    padding-right: 0.1em;
    padding-top: 0.05em;
}

.newspaper-columns-timeline__ruled-bg {
    background-image: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 4.9%,
        currentColor 4.9%,
        currentColor 5%
    );
}

.newspaper-columns-timeline__rule {
    height: 1px;
}

.newspaper-columns-timeline__separator .flex-grow-1 {
    height: 1px;
}

.newspaper-columns-timeline__columns {
    columns: 1;
    column-gap: 2.5rem;
}

@media (min-width: 768px) {
    .newspaper-columns-timeline__columns {
        columns: 2;
    }
}

.diagonal-zigzag-split__portrait {
    width: 8rem;
    height: 8rem;
}

.diagonal-zigzag-split__portrait--tilt-left {
    transform: rotate(-5deg);
}

.diagonal-zigzag-split__portrait--tilt-right {
    transform: rotate(5deg);
}

.diagonal-zigzag-split__portrait:hover {
    transform: rotate(0);
}

.diagonal-zigzag-split__beacon {
    width: 2rem;
    height: 2rem;
    bottom: -0.25rem;
    right: -0.25rem;
}

.diagonal-zigzag-split__beacon-dot {
    width: 0.75rem;
    height: 0.75rem;
}

.diagonal-zigzag-split__frame {
    width: 4rem;
    height: 4rem;
}

.diagonal-zigzag-split__frame--tl {
    top: 0;
    left: 0;
}

.diagonal-zigzag-split__frame--br {
    bottom: 0;
    right: 0;
}

.diagonal-zigzag-split__frame--rotate-45 {
    transform: rotate(45deg);
}

.diagonal-zigzag-split__frame--rotate-minus-45 {
    transform: rotate(-45deg);
}

.diagonal-zigzag-split__wash {
    width: 8rem;
}

.diagonal-zigzag-split__corner {
    width: 5rem;
    height: 5rem;
}

.diagonal-zigzag-split__min-shrink {
    min-width: 0;
}

@media (min-width: 768px) {
    .diagonal-zigzag-split__band--reverse {
        flex-direction: row-reverse;
    }

    .diagonal-zigzag-split__portrait {
        width: 10rem;
        height: 10rem;
    }
}

/* values v26 - full-bleed alternating panels */
.values-editorial__panel {
    opacity: 1;
    transform: translateY(0);
}

.values-editorial__panel.is-revealed {
    animation: values-editorial-reveal 700ms ease-out both;
}

.values-editorial__corner-shape {
    clip-path: polygon(100% 0, 100% 100%, 0 0);
}

@keyframes values-editorial-reveal {
    from {
        opacity: 0.4;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .values-editorial__panel.is-revealed {
        animation: none;
    }
}