.about-console__head { max-width: 46rem; }

.about-console__tab { appearance: none; -webkit-appearance: none; font: inherit; cursor: pointer; opacity: .6; transition: opacity 300ms ease, transform 300ms ease, box-shadow 300ms ease; }
.about-console__tab:hover { opacity: .85; }
.about-console__tab.is-active { opacity: 1; transform: translateY(-.25rem); }
.about-console__tab:focus-visible { outline: 2px solid; outline-offset: 2px; }
.about-console__tab { min-width: 0; }
.about-console__tab > :first-child { min-width: 0; max-width: 100%; overflow-wrap: anywhere; hyphens: auto; }
.about-console__num { width: 1.75rem; height: 1.75rem; font-size: .8125rem; }
.about-console__track { height: .25rem; }
.about-console__fill { width: 0; }

.about-console__panel.is-active { animation: about-console-in 600ms cubic-bezier(.2, .8, .2, 1) both; }
@keyframes about-console-in { from { opacity: 0; transform: translateY(1rem); } to { opacity: 1; transform: none; } }

.about-console__dot { width: .625rem; height: .625rem; }
.about-console__caption { font-size: .875rem; line-height: 1.25rem; }

.about-console__chart { aspect-ratio: 2 / 1; }
.about-console__chart svg { display: block; width: 100%; height: 100%; overflow: visible; }
.about-console__chart text { font-size: 13px; font-weight: 600; }

.about-console__line { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1400ms cubic-bezier(.2, .8, .2, 1); }
.about-console__fade { opacity: 0; transition: opacity 900ms ease 400ms; }
.about-console__col { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform 900ms cubic-bezier(.2, .8, .2, 1); }
.about-console__bar { transform-box: fill-box; transform-origin: 0 50%; transform: scaleX(0); transition: transform 900ms cubic-bezier(.2, .8, .2, 1); }
.about-console__arc { stroke-dashoffset: 0; transition: stroke-dasharray 1200ms cubic-bezier(.2, .8, .2, 1); }

.about-console__chart.is-drawn .about-console__line { stroke-dashoffset: 0; }
.about-console__chart.is-drawn .about-console__fade { opacity: 1; }
.about-console__chart.is-drawn .about-console__col,
.about-console__chart.is-drawn .about-console__bar { transform: none; }

@media (prefers-reduced-motion: reduce) {
    .about-console__tab, .about-console__line, .about-console__fade, .about-console__col, .about-console__bar, .about-console__arc { transition: none; }
    .about-console__panel.is-active { animation: none; }
}

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

/* metric value and its label wrap instead of pushing the label out of the panel */
.about-console :has(> strong > [data-count-to]) { flex-wrap: wrap; row-gap: .25rem; }
.about-console :has(> strong > [data-count-to]) > span { min-width: 0; overflow-wrap: anywhere; }

.masonry-image-timeline__masonry {
    column-gap: 1.5rem;
    column-count: 1;
}

@media (min-width: 768px) {
    .masonry-image-timeline__masonry {
        column-count: 2;
    }
}

@media (min-width: 1024px) {
    .masonry-image-timeline__masonry {
        column-count: 3;
    }
}

.masonry-image-timeline__aspect-wide {
    aspect-ratio: 16 / 9;
}

.masonry-image-timeline__aspect-md {
    aspect-ratio: 3 / 2;
}

.masonry-image-timeline__aspect-compact {
    aspect-ratio: 4 / 3;
}

.masonry-image-timeline__media {
    transition: transform 0.5s ease;
}

.masonry-image-timeline__card:hover .masonry-image-timeline__media {
    transform: scale(1.03);
}

.masonry-image-timeline__pattern {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.masonry-image-timeline__media--0 .masonry-image-timeline__pattern {
    background-image: radial-gradient(circle at 20% 30%, currentColor 0, transparent 42%);
    opacity: 0.12;
}

.masonry-image-timeline__media--1 .masonry-image-timeline__pattern {
    background-image: repeating-linear-gradient(
        -45deg,
        transparent,
        transparent 10px,
        currentColor 10px,
        currentColor 11px
    );
    opacity: 0.08;
}

.masonry-image-timeline__media--2 .masonry-image-timeline__pattern {
    background-image:
        radial-gradient(circle, currentColor 1px, transparent 1px);
    background-size: 14px 14px;
    opacity: 0.1;
}

.masonry-image-timeline__watermark {
    font-size: clamp(1.75rem, 5vw, 3rem);
    line-height: 1;
    letter-spacing: -0.04em;
}

.masonry-image-timeline__overlay-caption {
    transition: opacity 0.5s ease;
}

.masonry-image-timeline__card:hover .masonry-image-timeline__overlay-caption {
    opacity: 0.95 !important;
}

.masonry-image-timeline__card:hover .masonry-image-timeline__reveal-shift {
    transform: translateY(0);
}

.masonry-image-timeline__card:hover .masonry-image-timeline__badge-pos {
    opacity: 0;
    transition: opacity 0.3s ease;
}

@keyframes masonry-image-timeline__scale-in {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

.masonry-image-timeline__card {
    break-inside: avoid;
}

.masonry-image-timeline__card.is-visible {
    animation: masonry-image-timeline__scale-in 0.5s ease forwards;
}

.masonry-image-timeline__decor-tr {
    transform: translate(25%, -50%);
    top: 0;
    right: 0;
    width: 16rem;
    height: 16rem;
}

.masonry-image-timeline__decor-bl {
    transform: translate(-25%, 50%);
    bottom: 0;
    left: 0;
    width: 12rem;
    height: 12rem;
}

.masonry-image-timeline__subtitle-width {
    max-width: 36rem;
}

.masonry-image-timeline__reveal-shift {
    transform: translateY(1rem);
    transition: transform 0.3s ease;
}

.masonry-image-timeline__badge-pos {
    top: 0.5rem;
    left: 0.5rem;
    transition: opacity 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
    .masonry-image-timeline__media,
    .masonry-image-timeline__overlay-caption,
    .masonry-image-timeline__reveal-shift,
    .masonry-image-timeline__badge-pos,
    .masonry-image-timeline__card.is-visible {
        transition: none;
        animation: none;
        transform: none;
    }

    .masonry-image-timeline__card:hover .masonry-image-timeline__media {
        transform: none;
    }
}

.values-mission-panel__col {
    max-width: 24rem;
}

.values-mission-panel__thumb {
    width: 6rem;
    height: 6rem;
}

.values-mission-panel__card {
    max-width: 24rem;
}

.conviction-fan__card:nth-child(1) { transform: rotate(-3deg); }
.conviction-fan__card:nth-child(2) { transform: rotate(2deg); }
.conviction-fan__card:nth-child(3) { transform: rotate(-1deg); }
.conviction-fan__card:nth-child(4) { transform: rotate(3deg); }

.conviction-fan__card:hover {
    transform: rotate(0deg) translateY(-0.75rem);
}

/* quote wireframe — typography, aurora sweep, ruler marks, celtic knots, dual-image crop */

.quote-wire__heading-serif {
    font-family: Georgia, "Times New Roman", Times, serif;
}

.quote-wire__body-sans {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* horizontal aurora wave — translate only; gradient colors live in template classes */
@keyframes quoteWireAuroraSweep {
    0% {
        transform: translateX(-120%);
    }
    100% {
        transform: translateX(120%);
    }
}

.quote-wire__aurora {
    width: 60%;
    height: 140%;
    top: -20%;
    left: 20%;
    filter: blur(4rem);
    animation: quoteWireAuroraSweep 14s linear infinite;
    will-change: transform;
}

/* ruler measurement marks — tick pattern via transparent gaps, color from currentColor */
.quote-wire__ruler {
    height: 1.25rem;
    background-image:
        repeating-linear-gradient(
            90deg,
            currentColor 0,
            currentColor 1px,
            transparent 1px,
            transparent 6px
        ),
        repeating-linear-gradient(
            90deg,
            currentColor 0,
            currentColor 1px,
            transparent 1px,
            transparent 24px
        );
    background-size: 6px 40%, 24px 100%;
    background-position: left bottom, left top;
    background-repeat: repeat-x;
}

.quote-wire__ruler--vertical {
    width: 1.25rem;
    height: 100%;
    min-height: 8rem;
    background-image:
        repeating-linear-gradient(
            180deg,
            currentColor 0,
            currentColor 1px,
            transparent 1px,
            transparent 6px
        ),
        repeating-linear-gradient(
            180deg,
            currentColor 0,
            currentColor 1px,
            transparent 1px,
            transparent 24px
        );
    background-size: 40% 6px, 100% 24px;
    background-position: right top, left top;
    background-repeat: repeat-y;
}

/* wireframe corner brackets */
.quote-wire__bracket {
    width: 1.5rem;
    height: 1.5rem;
    border-style: solid;
    border-width: 0;
}

.quote-wire__bracket--tl {
    top: 0.5rem;
    left: 0.5rem;
    border-top-width: 2px;
    border-left-width: 2px;
}

.quote-wire__bracket--br {
    bottom: 0.5rem;
    right: 0.5rem;
    border-bottom-width: 2px;
    border-right-width: 2px;
}

/* celtic-knot corner accents — interlaced L-shapes, distinct from deck overlap variant */
.quote-wire__knot {
    width: 1.75rem;
    height: 1.75rem;
    pointer-events: none;
}

.quote-wire__knot--tl {
    top: 0.35rem;
    left: 0.35rem;
    clip-path: polygon(0 0, 100% 0, 100% 28%, 28% 28%, 28% 100%, 0 100%, 0 55%, 55% 55%, 55% 0);
}

.quote-wire__knot--tr {
    top: 0.35rem;
    right: 0.35rem;
    clip-path: polygon(0 0, 100% 0, 100% 55%, 72% 55%, 72% 100%, 45% 100%, 45% 28%, 0 28%);
}

.quote-wire__knot--bl {
    bottom: 0.35rem;
    left: 0.35rem;
    clip-path: polygon(0 45%, 28% 45%, 28% 0, 55% 0, 55% 72%, 100% 72%, 100% 100%, 0 100%);
}

.quote-wire__knot--br {
    bottom: 0.35rem;
    right: 0.35rem;
    clip-path: polygon(72% 0, 100% 0, 100% 100%, 0 100%, 0 72%, 45% 72%, 45% 45%, 72% 45%);
}

/* featured card — diagonal crop dual-image overlap */
.quote-wire__dual-media {
    position: relative;
    height: 9rem;
    overflow: hidden;
}

.quote-wire__dual-media img {
    position: absolute;
    top: 0;
    width: 78%;
    height: 100%;
    object-fit: cover;
}

.quote-wire__dual-media img:first-child {
    left: 0;
    z-index: 1;
    clip-path: polygon(0 0, 100% 0, 62% 100%, 0 100%);
}

.quote-wire__dual-media img:last-child {
    right: 0;
    z-index: 2;
    clip-path: polygon(38% 0, 100% 0, 100% 100%, 0 100%);
}

/* wireframe grid crosshair overlay */
.quote-wire__crosshair {
    background-image:
        linear-gradient(currentColor 1px, transparent 1px),
        linear-gradient(90deg, currentColor 1px, transparent 1px);
    background-size: 32px 32px;
    opacity: 0.35;
}

/* slot group spacing — vertical rhythm between named slots */
.quote-wire__slot-stack > [data-slot] + [data-slot] {
    margin-top: 1rem;
}

.quote-wire__card-slot > [data-slot="attribution"] {
    margin-top: auto;
    padding-top: 0.75rem;
}

.quote-wire__panel-body {
    min-width: 0;
}
/* hover + focus affordances (layout/outline via theme token) */
@media (hover: hover) {
    .quote-wire-root [role="listitem"]:hover,
    .quote-wire-root article:hover,
    .quote-wire-root [class*="quote-wire__card"]:hover,
    .quote-wire-root .quote-wire__book:hover,
    .quote-wire-root .quote-wire__step:hover,
    .quote-wire-root .quote-wire__index-card:hover,
    .quote-wire-root .quote-wire__pill:hover,
    .quote-wire-root .quote-wire__item:hover {
        transform: translateY(-0.125rem);
    }
}

.quote-wire-root [role="listitem"],
.quote-wire-root article,
.quote-wire-root [class*="quote-wire__card"],
.quote-wire-root .quote-wire__book,
.quote-wire-root .quote-wire__step,
.quote-wire-root .quote-wire__index-card,
.quote-wire-root .quote-wire__pill {
    transition: transform 200ms ease;
}

.quote-wire-root a:focus-visible,
.quote-wire-root button:focus-visible,
.quote-wire-root [tabindex="0"]:focus-visible,
.quote-wire-root input:focus-visible,
.quote-wire-root summary:focus-visible,
.quote-wire-root [role="slider"]:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

@media (hover: hover) {
    .quote-wire-root button:hover,
    .quote-wire-root a:hover,
    .quote-wire-root summary:hover {
        opacity: 0.92;
    }
}