/* Auto Glass World - ADAS (modules/global/global_adas.php) */
.agw-adas {
    position: relative;
    overflow: hidden;
    padding: var(--agw-space-section) 0;
    background: var(--agw-color-pale);
}

.agw-adas-grid {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: var(--agw-gap);
    align-items: center;
}

.agw-adas-copy {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.agw-adas-copy .eyebrow {
    margin-bottom: calc(var(--agw-label-gap) - 24px);
}

.agw-adas-copy .agw-lead {
    max-width: 40ch;
}

.agw-adas-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.agw-adas-tags li {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 8px 16px;
    border: 1px solid #c4cfe2;
    border-radius: 999px;
    background: var(--agw-color-white);
    color: var(--agw-color-navy);
    font-size: var(--agw-fs-text);
    font-weight: 500;
}

.agw-adas-tags i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--agw-color-primary);
}

.agw-adas-visual {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
    padding: clamp(16px, 2vw, 24px);
    border: 1px solid var(--agw-color-cool-line);
    border-radius: 14px;
    background: var(--agw-color-white);
    box-shadow: 0 30px 60px -40px rgba(11, 30, 61, 0.3);
}

.agw-adas-visual svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

.agw-adas-visual figcaption {
    color: var(--agw-color-muted);
    font-family: var(--agw-font-mono);
    font-size: var(--agw-fs-label);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ad-cone {
    fill: rgba(38, 80, 188, 0.12);
}

.ad-cone-line {
    stroke: var(--agw-color-primary);
    stroke-width: 1;
    stroke-dasharray: 4 7;
}

.ad-ws {
    fill: rgba(38, 80, 188, 0.05);
    stroke: rgba(11, 30, 61, 0.55);
    stroke-width: 1.6;
}

.ad-line {
    stroke: rgba(11, 30, 61, 0.2);
    stroke-width: 1;
}

.ad-target {
    stroke: var(--agw-color-navy);
    stroke-width: 1.6;
}

.ad-cam {
    fill: var(--agw-color-navy);
}

.ad-lens {
    stroke: var(--agw-color-sky);
    stroke-width: 2;
}

.ad-arrow {
    stroke: var(--agw-color-primary);
}

.ad-pulse {
    stroke: var(--agw-color-primary);
    stroke-width: 1.2;
    transform-box: fill-box;
    transform-origin: center;
}

.ad-label {
    fill: var(--agw-color-primary);
    font-family: var(--agw-font-mono);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.14em;
}

/* Motion: transform / opacity / clip only. Without scroll timelines everything shows at once. */
@media (prefers-reduced-motion: no-preference) {
    .ad-pulse {
        animation: agw-ad-pulse 2.8s ease-out infinite;
    }

    .ad-pulse + .ad-pulse {
        animation-delay: 1.4s;
    }

    @supports (animation-timeline: view()) {
        .ad-reveal {
            animation: agw-fov linear both;
            animation-timeline: view();
            animation-range: entry 20% cover 50%;
        }

        .ad-targets {
            animation: agw-ad-fade linear both;
            animation-timeline: view();
            animation-range: entry 45% cover 58%;
        }
    }
}

@keyframes agw-ad-pulse {
    from {
        opacity: 1;
        transform: scale(0.6);
    }

    to {
        opacity: 0;
        transform: scale(2.6);
    }
}

@keyframes agw-fov {
    from {
        clip-path: inset(100% 0 0 0);
    }

    to {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes agw-ad-fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (max-width: 991px) {
    .agw-adas-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}
