/* ==========================================================================
   Generic section helpers, marquees, dividers
   ========================================================================== */

.ab-text-accent { color: var(--ab-orange-500); }
.ab-text-ice    { color: var(--ab-ice-500); }
.ab-text-brand  { color: var(--ab-ice-brand); }
.ab-text-frost  { color: var(--ab-ice-300); }
.ab-text-petrol { color: var(--ab-petrol-600); }
.ab-text-mute   { color: var(--ab-ink-400); }

.ab-divider {
    height: 80px;
    background:
        repeating-linear-gradient(135deg, transparent 0, transparent 40px, var(--ab-frost) 40px, var(--ab-frost) 41px);
}

/* ──────── Marquee — seamless infinite scroll ──────── */
.ab-marquee {
    overflow: hidden;
    background: var(--ab-petrol-700);
    border-top: 1px solid rgba(255,255,255,0.06);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding: 22px 0;
}
.ab-marquee__track {
    display: flex;
    width: max-content;
    /* NO gap — would create off-by-half-gap at the loop boundary.
       Each span owns its own trailing space (padding-right + ::after margin). */
    animation: ab-marquee 40s linear infinite;
}
.ab-marquee__track:hover { animation-play-state: paused; }
.ab-marquee__track span {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding-right: 32px;             /* trailing space after the dot */
    color: var(--ab-ice-200);
    font-family: var(--ab-font-display);
    font-size: 1.2rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}
/* Separator dot — sits AFTER each span text, with equal spacing on both sides.
   Because every span (including the last of each set) has a trailing dot,
   the loop is visually seamless at the duplicate boundary. */
.ab-marquee__track span::after {
    content: '';
    display: inline-block;
    width: 5px; height: 5px;
    background: var(--ab-orange-500);
    border-radius: 50%;
    margin-left: 32px;               /* space BEFORE the dot (matches padding-right after) */
    flex-shrink: 0;
}
@keyframes ab-marquee {
    from { transform: translateX(0); }
    /* 3 duplicate sets — translate -33.333% snaps from end of set2 → start of set2 */
    to   { transform: translateX(-33.3333%); }
}
@media (prefers-reduced-motion: reduce) {
    .ab-marquee__track { animation: none; }
}

/* Two-column content + media */
.ab-split { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.ab-split--media-right .ab-split__media { order: 2; }
.ab-split__media { position: relative; aspect-ratio: 4/3; border-radius: var(--ab-radius-lg); overflow: hidden; }
.ab-split__media img { width:100%; height:100%; object-fit: cover; }
.ab-split__media::after {
    content:''; position: absolute; right: -20px; bottom: -20px;
    width: 60px; height: 6px; background: var(--ab-orange-500); transform: skewX(-28deg);
}

@media (max-width: 900px) {
    .ab-split { grid-template-columns: 1fr; gap: 36px; }
    .ab-split--media-right .ab-split__media { order: -1; }
}

/* Stats row */
.ab-stats-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-top: 1px solid rgba(10, 30, 42, 0.10);
    border-bottom: 1px solid rgba(10, 30, 42, 0.10);
    padding: 44px 0;
}
.ab-stats-row__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 4px 28px;
    border-right: 1px solid rgba(110, 204, 220, 0.35);
}
.ab-stats-row__item:last-child { border-right: 0; }
.ab-stats-row__num { font-family: var(--ab-font-display); font-size: clamp(2.2rem, 4vw, 3.2rem); color: var(--ab-ink-900); line-height: 1; }
.ab-stats-row__num .ab-slash { display: inline-block; width: 10px; height: 4px; transform: skewX(-28deg); background: var(--ab-ice-brand); margin-right: 4px; vertical-align: middle; }
.ab-stats-row__lbl { font-family: var(--ab-font-mono); font-size: 0.76rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ab-ink-500); }
@media (max-width: 760px) {
    .ab-stats-row { grid-template-columns: repeat(2, 1fr); padding: 32px 0; }
    .ab-stats-row__item { padding: 16px 14px; }
    .ab-stats-row__item:nth-child(2) { border-right: 0; }
    .ab-stats-row__item:nth-child(1),
    .ab-stats-row__item:nth-child(2) { border-bottom: 1px solid rgba(110, 204, 220, 0.35); }
}

/* Section divider with orange slash */
.ab-section-divider {
    height: 6px; width: 80px; background: var(--ab-orange-500);
    transform: skewX(-28deg); margin: 36px 0;
}
.ab-section-head--center .ab-section-divider { margin-left: auto; margin-right: auto; }

/* CTA strip — used between sections */
.ab-cta-strip {
    background: linear-gradient(135deg, var(--ab-ice-500), var(--ab-ice-700));
    color: var(--ab-white);
    padding: 38px 0;
}
.ab-cta-strip__inner { display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; align-items: center; }
.ab-cta-strip h3 { color: var(--ab-white); margin: 0; font-size: clamp(1.3rem, 2.4vw, 1.8rem); }
.ab-cta-strip p { color: rgba(255,255,255,0.85); margin: 0; }
.ab-cta-strip .ab-btn--accent { background: var(--ab-orange-500); }