/* intro v17 — Death Note noir: circuit band, pulse rings, extrude text, duotone media, scroll slide-in */

/* Circuit-board traces — colour via Tailwind text-* on the band, currentColor in the pattern */
.intro-noir__circuit {
    background-image:
        repeating-linear-gradient(0deg, currentColor 0 1px, transparent 1px 32px),
        repeating-linear-gradient(90deg, currentColor 0 1px, transparent 1px 32px);
    opacity: 0.18;
    -webkit-mask: linear-gradient(180deg, black, transparent);
    mask: linear-gradient(180deg, black, transparent);
}

/* Pulse rings from the band centre (size + placement so Bootstrap has no utility gap) */
.intro-noir__ring {
    width: 6rem;
    height: 6rem;
    top: 6rem;
    left: 50%;
    margin-left: -3rem;
    opacity: 0;
    animation: intro-noir-pulse 3.4s ease-out infinite;
}
.intro-noir__ring--2 { animation-delay: 1.7s; }

@keyframes intro-noir-pulse {
    0%   { transform: scale(0.4); opacity: 0.55; }
    100% { transform: scale(3.4); opacity: 0; }
}

/* Emboss seal circle */
.intro-noir__seal {
    width: 7rem;
    height: 7rem;
    font-size: 0.75rem;
    line-height: 1.1;
    padding: 0.75rem;
    transform: rotate(-8deg);
}

/* Extrude — stacked text-shadow depth using the element's own colour */
.intro-noir__extrude {
    text-shadow: 1px 1px 0 currentColor, 2px 2px 0 currentColor, 3px 3px 0 currentColor;
}

/* Duotone media: grayscale image + primary multiply tint (colour is a Tailwind class) */
.intro-noir__img {
    height: 10rem;
    object-fit: cover;
    filter: grayscale(1) contrast(1.05);
}

/* Sticky aside offset (Bootstrap position-sticky has no top-16 utility) */
@media (min-width: 992px) {
    .intro-noir__aside { top: 4rem; }
}
.intro-noir__tint {
    mix-blend-mode: multiply;
    opacity: 0.5;
}

/* Letter-spacing widen on hover */
.intro-noir__ttl { transition: letter-spacing 260ms ease; }
[data-card]:hover .intro-noir__ttl { letter-spacing: 0.08em; }

/* Slide-in entrance — pure CSS on the reliable [data-card] attribute; always ends visible */
@keyframes intro-noir-rise {
    from { opacity: 0; transform: translateY(2rem); }
    to   { opacity: 1; transform: translateY(0); }
}
.intro-noir [data-card] { animation: intro-noir-rise 560ms ease both; }

@media (prefers-reduced-motion: reduce) {
    .intro-noir__ring { animation: none; }
    .intro-noir [data-card] { animation: none; }
}

.services-tabs__serif,
[data-serif] {
    font-family: Georgia, "Times New Roman", Times, serif;
}

.services-tabs__btn {
    background-color: transparent;
}
.services-tabs__btn:hover {
    background-color: color-mix(in srgb, var(--bs-secondary-color) 6%, transparent);
}
.services-tabs__btn.is-active {
    border-color: var(--bs-primary) !important;
    background-color: color-mix(in srgb, var(--bs-primary) 8%, transparent) !important;
}

.content-disclaimer-logo__mark {
    width: 5rem;
    height: 5rem;
}

.content-disclaimer-logo__mark--small {
    width: 3rem;
    height: 3rem;
}

.content-disclaimer-logo__mark--large {
    width: 6rem;
    height: 6rem;
}

.content-disclaimer-logo__mark svg {
    display: block;
    width: 100%;
    height: 100%;
}

.content-disclaimer-ticker__rail {
    animation: content-disclaimer-drift 9s ease-in-out infinite alternate;
}

.content-disclaimer-orb--large {
    width: 12rem;
    height: 12rem;
    animation: content-disclaimer-float 8s ease-in-out infinite;
}

.content-disclaimer-orb--small {
    width: 7rem;
    height: 7rem;
    animation: content-disclaimer-float 7s ease-in-out infinite reverse;
}

.content-disclaimer-corner {
    width: 4rem;
    height: 4rem;
    pointer-events: none;
}

.content-disclaimer-orbit__ring {
    animation: content-disclaimer-spin 14s linear infinite;
}

.content-disclaimer-rail__accent {
    width: 100%;
    height: 0.75rem;
    flex-shrink: 0;
    animation: content-disclaimer-grow 5s ease-in-out infinite alternate;
}

.content-disclaimer-pattern {
    pointer-events: none;
}

.content-disclaimer-pulse {
    width: 0.75rem;
    height: 0.75rem;
    animation: content-disclaimer-pulse 1.8s ease-in-out infinite;
}

@media (min-width: 768px) {
    .content-disclaimer-rail__accent {
        width: 0.75rem;
        height: auto;
    }
}

@keyframes content-disclaimer-drift {
    from { transform: translateX(-1rem); }
    to { transform: translateX(1rem); }
}

@keyframes content-disclaimer-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(0.75rem); }
}

@keyframes content-disclaimer-spin {
    from { transform: rotate(0deg) scale(1); }
    to { transform: rotate(360deg) scale(1.04); }
}

@keyframes content-disclaimer-grow {
    from { transform: scaleX(0.75); }
    to { transform: scaleX(1); }
}

@keyframes content-disclaimer-pulse {
    0%, 100% { transform: scale(1); opacity: 0.65; }
    50% { transform: scale(1.35); opacity: 1; }
}

/* process split — shell split, deck grid, marker, step numbers, stagger, panel borders */
.process-split__shell {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: start;
}

@media (min-width: 992px) {
    .process-split__shell {
        grid-template-columns: 1fr 1fr;
        gap: 3.5rem;
    }
}

.process-split__deck {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
}

.process-split__marker {
    width: 0.625rem;
    height: 0.625rem;
}

.process-split__num {
    font-size: clamp(2.75rem, 5vw, 4.5rem);
    line-height: 0.9;
    letter-spacing: -0.03em;
}

.process-split__rule {
    width: 100%;
    height: 1px;
}

.process-split__col .process-split__blade:last-child {
    border-bottom-width: 0;
}

@media (min-width: 992px) {
    .process-split__deck--ruled {
        border-left: 1px solid var(--bs-border-color);
        border-top-width: 0;
        padding-top: 3.5rem;
    }

    .process-split__col--shift {
        margin-top: -3.5rem;
    }
}

@media (max-width: 991px) {
    .process-split__col--shift {
        margin-top: 0;
    }
}

.process-split__blade {
    transition: transform 200ms ease;
}

.process-split__blade:hover {
    transform: translateY(-2px);
}

/* FAQ v14 — chat bubble max-widths */
.faq-chat__bubble-q { max-width: 20rem; }
.faq-chat__bubble-a { max-width: 32rem; }

