.intro-cta-content {
    max-width: 56rem;
}

/* Event v30: Flip card on hover */
.flip-card-events__icon-wrap { width: 4rem; height: 4rem; }

.flip-card-events__rack {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    width: 100%;
    max-width: 64rem;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .flip-card-events__rack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .flip-card-events__rack {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.flip-card-events-pack {
    perspective: 1000px;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 4 / 5;
    min-height: 18rem;
}

.flip-card-events-core {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100%;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

.flip-card-events-pack:hover .flip-card-events-core {
    transform: rotateY(180deg);
}

.flip-card-events-facing,
.flip-card-events-reverse {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.flip-card-events-reverse {
    transform: rotateY(180deg);
}

/* v27 - folded paper corner (clip-path fold has no TW/BS utility) */
[data-fold-card] {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 1.25rem 100%, 0 calc(100% - 1.25rem));
    transition: clip-path 200ms ease;
}

[data-fold-card]:hover {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0.5rem 100%, 0 calc(100% - 0.5rem));
}

/* Three-column grid — real CSS grid, framework-agnostic (never row/col-* + gap together) */
.parchment-trio__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

@media (min-width: 768px) {
    .parchment-trio__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Fixed icon badge size — no Bootstrap utility beyond w-25/50/75/100 */
.parchment-trio__badge {
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Card hover: scale */
.portfolio-item-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.portfolio-item-hover:hover {
    transform: scale(1.05);
}

/* quote v11 — constellation layout, LED-style cards, CRT phosphor background */
/* All color values below are `currentColor` (inherited from the Tailwind/Bootstrap
   text-color utility on the same element) or plain theme-token utilities set in the
   template — no hex/rgb/hsl literals live here. */

.constellation-quote__phosphor {
    background-image: radial-gradient(circle at 50% 20%, currentColor, transparent 70%);
}

.constellation-quote__scanlines {
    background-image: repeating-linear-gradient(
        to bottom,
        currentColor 0,
        currentColor 1px,
        transparent 1px,
        transparent 4px
    );
    background-size: 100% 4px;
}

/* drifting noise-field blobs — layout/animation only, tint comes from the tw/bs bg utility */
.constellation-quote__blob {
    width: 18rem;
    height: 18rem;
    filter: blur(48px);
    animation: constellation-quote-drift 18s ease-in-out infinite;
}

.constellation-quote__blob--a {
    top: -4rem;
    left: -3rem;
    animation-delay: 0s;
}

.constellation-quote__blob--b {
    right: -3rem;
    bottom: -5rem;
    animation-delay: 6s;
}

.constellation-quote__blob--c {
    top: 38%;
    left: 55%;
    width: 14rem;
    height: 14rem;
    animation-delay: 12s;
}

@keyframes constellation-quote-drift {
    0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: .55;
    }
    50% {
        transform: translate(2rem, -1.5rem) scale(1.12);
        opacity: .9;
    }
}

/* geometric constellation accents (pentagon / octagon) */
.constellation-quote__shape {
    width: 3rem;
    height: 3rem;
}

.constellation-quote__shape--pentagon {
    top: 1.5rem;
    right: 8%;
    clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
}

.constellation-quote__shape--octagon {
    bottom: 2rem;
    left: 6%;
    width: 2.5rem;
    height: 2.5rem;
    clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
}

/* thin connecting lines between constellation nodes */
.constellation-quote__line {
    height: 1px;
}

.constellation-quote__line--a {
    top: 46%;
    left: 8%;
    width: 34%;
    transform: rotate(6deg);
}

.constellation-quote__line--b {
    top: 58%;
    right: 8%;
    width: 34%;
    transform: rotate(-8deg);
}

/* staggered node offsets for the constellation feel — margin (not transform) so grid gap stays intact */
.constellation-quote__col--2 {
    margin-top: 1.75rem;
}

.constellation-quote__col--3 {
    margin-top: 2.25rem;
}

.constellation-quote__col--4 {
    margin-top: 0.25rem;
}

.constellation-quote__card {
    min-height: 15rem;
    letter-spacing: .04em;
    transition: transform 200ms ease, box-shadow 200ms ease;
}

/* drag-to-reorder visual feedback — opacity only, no color change */
.constellation-quote__col.is-dragging {
    opacity: .4;
}

.constellation-quote__col.is-drop-target .constellation-quote__card {
    transform: scale(0.98);
}

@media (prefers-reduced-motion: reduce) {
    .constellation-quote__blob {
        animation: none;
    }
}
/* hover + focus affordances (layout/outline via theme token) */
@media (hover: hover) {
    .constellation-quote-root [role="listitem"]:hover,
    .constellation-quote-root article:hover,
    .constellation-quote-root [class*="constellation-quote__card"]:hover,
    .constellation-quote-root .constellation-quote__book:hover,
    .constellation-quote-root .constellation-quote__step:hover,
    .constellation-quote-root .constellation-quote__index-card:hover,
    .constellation-quote-root .constellation-quote__pill:hover,
    .constellation-quote-root .constellation-quote__item:hover {
        transform: translateY(-0.125rem);
    }
}

.constellation-quote-root [role="listitem"],
.constellation-quote-root article,
.constellation-quote-root [class*="constellation-quote__card"],
.constellation-quote-root .constellation-quote__book,
.constellation-quote-root .constellation-quote__step,
.constellation-quote-root .constellation-quote__index-card,
.constellation-quote-root .constellation-quote__pill {
    transition: transform 200ms ease;
}

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

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

.cta-hub__stage { min-height: 24rem; }
.cta-hub__lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.cta-hub__lines path { stroke-dasharray: 6 8; opacity: 0; }
[data-hub].is-visible .cta-hub__lines path { opacity: .5; animation: cta-hub-flow 1.2s linear infinite; transition: opacity 600ms ease 400ms; }

.cta-hub__node { opacity: 0; transition: opacity 500ms ease, transform 700ms cubic-bezier(.2, .8, .2, 1); }
.cta-hub__node--0 { top: 12% !important; left: 4% !important; transform: translate(-1.5rem, -1.5rem); }
.cta-hub__node--1 { top: 12% !important; left: auto !important; right: 4%; transform: translate(1.5rem, -1.5rem); }
.cta-hub__node--2 { top: auto !important; bottom: 12%; left: 4% !important; transform: translate(-1.5rem, 1.5rem); }
.cta-hub__node--3 { top: auto !important; bottom: 12%; left: auto !important; right: 4%; transform: translate(1.5rem, 1.5rem); }
[data-hub].is-visible .cta-hub__node { opacity: 1; transform: none; animation: cta-hub-bob 5s ease-in-out 1s infinite; }
[data-hub].is-visible .cta-hub__node--1 { transition-delay: 120ms; animation-delay: 1.6s; }
[data-hub].is-visible .cta-hub__node--2 { transition-delay: 240ms; animation-delay: 2.2s; }
[data-hub].is-visible .cta-hub__node--3 { transition-delay: 360ms; animation-delay: 2.8s; }

.cta-hub__core { transform: translate(-50%, -50%) scale(.8); opacity: 0; transition: transform 700ms cubic-bezier(.2, .8, .2, 1) 500ms, opacity 500ms ease 500ms; }
[data-hub].is-visible .cta-hub__core { transform: translate(-50%, -50%) scale(1); opacity: 1; }
.cta-hub__micro { font-size: .75rem; }

@keyframes cta-hub-flow { to { stroke-dashoffset: -28; } }
@keyframes cta-hub-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }

@media (prefers-reduced-motion: reduce) {
    .cta-hub__node, .cta-hub__core { transition: none; animation: none; opacity: 1; }
    [data-hub].is-visible .cta-hub__lines path { animation: none; }
}
/* phones: keep the four orbit nodes from colliding */
@media (max-width: 575px) {
    .cta-hub__node { max-width: 44%; padding: .5rem .75rem !important; font-size: .8125rem; line-height: 1.15rem; }
}

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

