/*
 * ATLANTIC IMAGE DEFENSE — v1.15.4.19.35.451.363
 * Home page, "Visual identity" teaser: compact monitoring console.
 * A round radar (status dots on a ring) beside a feed of four signals.
 * One colour per status, used everywhere in the block:
 *   new match = cyan, authorized = green, review required = rose,
 *   licence expiring = amber.
 */

.aid-home-page .avm-home-teaser {
    --avmx-match: #38d0e0;
    --avmx-authorized: #3fd08f;
    --avmx-review: #f2687f;
    --avmx-license: #e8b65a;
    --avmx-line: rgba(231, 199, 146, .22);
    --avmx-ink: #f4f7fb;
    --avmx-muted: #9fb0c8;
    padding: 88px 0;
}

/* Copy column and panel: balanced, vertically centred. */
.aid-home-page .avm-home-teaser .avm-home-teaser-grid {
    grid-template-columns: minmax(0, 11fr) minmax(0, 13fr);
    gap: clamp(40px, 5vw, 72px);
    align-items: center;
}

/* Title: three lines at most on large screens, in every language. */
.aid-home-page .avm-home-teaser .avm-home-teaser-copy h2 {
    max-width: none;
    font-size: clamp(34px, 2.9vw, 46px);
    line-height: 1.08;
    letter-spacing: -.035em;
    text-wrap: balance !important; /* the site sets "wrap !important" on titles */
}
.aid-home-page .avm-home-teaser .avmx-title-line { display: block; }
.aid-home-page .avm-home-teaser .avm-home-teaser-copy > p {
    max-width: 34em;
    margin-top: 18px;
    font-size: 16px;
    line-height: 1.7;
}
.aid-home-page .avm-home-teaser .avm-home-teaser-actions { margin-top: 26px; gap: 18px 24px; }

/* ---------------------------------------------------------------- Panel */
.avmx-panel {
    position: relative;
    display: grid;
    gap: 0;
    min-width: 0;
    border: 1px solid var(--avmx-line);
    border-radius: 2px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015)),
        rgba(8, 18, 36, .78);
    box-shadow: 0 24px 60px rgba(2, 8, 20, .35);
    color: var(--avmx-ink);
}
.avmx-panel::before {
    /* thin champagne rule on top, as on the service buttons */
    content: "";
    position: absolute;
    inset: -1px -1px auto;
    height: 2px;
    background: linear-gradient(90deg, #e7c792, rgba(231, 199, 146, 0));
}

.avmx-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.avmx-live { display: inline-flex; align-items: center; gap: 9px; color: #e7c792; }
.avmx-live i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--avmx-authorized);
    box-shadow: 0 0 0 0 rgba(63, 208, 143, .55);
    animation: avmx-pulse 2.4s ease-out infinite;
}
.avmx-count {
    padding: 4px 9px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 2px;
    color: var(--avmx-muted);
    letter-spacing: .08em;
    white-space: nowrap;
}

.avmx-body {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 24px;
    align-items: center;
    padding: 22px 20px;
}

/* ---------------------------------------------------------------- Radar */
.avmx-radar {
    position: relative;
    width: 200px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    isolation: isolate;
}
.avmx-radar__ring,
.avmx-radar__grid,
.avmx-radar__sweep { position: absolute; inset: 0; border-radius: 50%; }
.avmx-radar__ring {
    /* four arcs, one per status, with small gaps */
    background: conic-gradient(
        from -45deg,
        var(--avmx-match) 0 84deg, transparent 84deg 90deg,
        var(--avmx-authorized) 90deg 174deg, transparent 174deg 180deg,
        var(--avmx-license) 180deg 264deg, transparent 264deg 270deg,
        var(--avmx-review) 270deg 354deg, transparent 354deg 360deg
    );
    -webkit-mask: radial-gradient(circle, transparent 0 calc(50% - 5px), #000 calc(50% - 4px) 50%, transparent calc(50% + 1px));
            mask: radial-gradient(circle, transparent 0 calc(50% - 5px), #000 calc(50% - 4px) 50%, transparent calc(50% + 1px));
    opacity: .9;
}
.avmx-radar__grid {
    inset: 14px;
    background:
        radial-gradient(circle, transparent 0 32%, rgba(255, 255, 255, .07) 32% calc(32% + 1px), transparent calc(32% + 1px) 64%, rgba(255, 255, 255, .07) 64% calc(64% + 1px), transparent calc(64% + 1px)),
        linear-gradient(rgba(255, 255, 255, .06), rgba(255, 255, 255, .06)) center / 1px 100% no-repeat,
        linear-gradient(rgba(255, 255, 255, .06), rgba(255, 255, 255, .06)) center / 100% 1px no-repeat,
        radial-gradient(circle, rgba(56, 208, 224, .08), rgba(8, 18, 36, .2) 70%);
}
.avmx-radar__sweep {
    inset: 14px;
    background: conic-gradient(from 0deg, rgba(231, 199, 146, .2), rgba(231, 199, 146, 0) 60deg);
    animation: avmx-sweep 7s linear infinite;
}
.avmx-radar__dot {
    position: absolute;
    width: 10px;
    height: 10px;
    margin: -5px 0 0 -5px;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(8, 18, 36, .85);
}
/* positions on the inner circles, matching the arcs */
.avmx-radar__dot.is-match      { left: 64%; top: 27%; background: var(--avmx-match); }
.avmx-radar__dot.is-authorized { left: 76%; top: 62%; background: var(--avmx-authorized); }
.avmx-radar__dot.is-review     { left: 30%; top: 36%; background: var(--avmx-review); animation: avmx-blink 2.4s ease-in-out infinite; }
.avmx-radar__dot.is-license    { left: 40%; top: 74%; background: var(--avmx-license); }
.avmx-radar__core {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin: -29px 0 0 -29px;
    border: 1px solid rgba(231, 199, 146, .55);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #1b3358, #0b1628 70%);
    color: #e7c792;
    font-size: 20px;
}

/* ----------------------------------------------------------------- Feed */
.avmx-feed {
    display: grid;
    gap: 8px;
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}
.avmx-row {
    --tone: var(--avmx-match);
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 9px 14px 9px 12px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-left: 2px solid var(--tone);
    border-radius: 2px;
    background: rgba(255, 255, 255, .03);
    transition: background-color .2s ease, transform .2s ease, border-color .2s ease;
}
.avmx-row.is-authorized { --tone: var(--avmx-authorized); }
.avmx-row.is-review     { --tone: var(--avmx-review); }
.avmx-row.is-license    { --tone: var(--avmx-license); }
.avmx-row:hover { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); border-left-color: var(--tone); transform: translateX(2px); }

.avmx-row__icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--tone);
    border-radius: 50%;
    color: var(--tone);
    font-size: 14px;
}
.avmx-row__text {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px 10px;
    min-width: 0;
}
.avmx-row__text strong {
    order: 2;
    flex: 1 0 100%;
    min-width: 0;
    color: var(--avmx-ink);
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.3;
}
.avmx-row__text small {
    order: 3;
    flex: 1 0 100%;
    color: var(--avmx-muted);
    font-size: 12px;
    line-height: 1.3;
}
.aid-home-page .avmx-status {
    order: 1;
    flex: 0 0 auto;
    max-width: 100%;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 3px 8px;
    border: 1px solid var(--tone);
    border-radius: 2px;
    background: color-mix(in srgb, var(--tone) 14%, transparent);
    color: var(--tone);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: .09em;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}
.aid-home-page .avmx-status:hover,
.aid-home-page .avmx-status:focus-visible {
    background: var(--tone);
    color: #08121f;
    outline: none;
}
.aid-home-page .avmx-status:focus-visible { box-shadow: 0 0 0 2px #08121f, 0 0 0 4px var(--tone); }

.avmx-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 11px 20px 13px;
    border-top: 1px solid rgba(255, 255, 255, .07);
    color: var(--avmx-muted);
    font-size: 12px;
    line-height: 1.4;
}
.avmx-foot i { color: #e7c792; }

/* Round elements stay perfectly round. The site's square-corner rule lives
 * in the "aid-refine" cascade layer, so the exception is declared in the
 * same layer with a more specific selector. */
@layer aid-refine {
body.aid-context-public .avmx-radar, body.aid-context-public .avmx-radar__ring,
body.aid-context-public .avmx-radar__grid, body.aid-context-public .avmx-radar__sweep,
body.aid-context-public .avmx-radar__dot, body.aid-context-public .avmx-radar__core,
body.aid-context-public .avmx-row__icon, body.aid-context-public .avmx-live i { border-radius: 50% !important; }
}
.avmx-radar { overflow: hidden; }

/* ------------------------------------------------------------ Animations */
@keyframes avmx-sweep { to { transform: rotate(360deg); } }
@keyframes avmx-pulse {
    0% { box-shadow: 0 0 0 0 rgba(63, 208, 143, .55); }
    70%, 100% { box-shadow: 0 0 0 8px rgba(63, 208, 143, 0); }
}
@keyframes avmx-blink { 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) {
    .avmx-radar__sweep, .avmx-live i, .avmx-radar__dot { animation: none !important; }
    .avmx-row { transition: none; }
}

/* ------------------------------------------------------------ Responsive */
/* Laptop: slightly smaller radar. */
@media (max-width: 1399.98px) {
    .avmx-body { grid-template-columns: 170px minmax(0, 1fr); gap: 20px; }
    .avmx-radar { width: 170px; }
}
/* Tablet landscape and below: copy above, panel below at full width. */
@media (max-width: 1199.98px) {
    .aid-home-page .avm-home-teaser .avm-home-teaser-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
    .aid-home-page .avm-home-teaser .avm-home-teaser-copy h2 { max-width: 18em; font-size: clamp(32px, 4.4vw, 44px); }
    .avmx-panel { width: 100%; max-width: 860px; margin: 0 auto; }
    .avmx-body { grid-template-columns: 190px minmax(0, 1fr); }
    .avmx-radar { width: 190px; }
}
/* Tablet portrait. */
@media (max-width: 767.98px) {
    .aid-home-page .avm-home-teaser { padding: 64px 0; }
    .avmx-body { grid-template-columns: 140px minmax(0, 1fr); gap: 16px; padding: 18px 16px; }
    .avmx-radar { width: 140px; }
    .avmx-radar__core { width: 46px; height: 46px; margin: -23px 0 0 -23px; font-size: 16px; }
    .avmx-head, .avmx-foot { padding-left: 16px; padding-right: 16px; }
}
/* Mobile: radar on top, centred; status under the title. */
@media (max-width: 575.98px) {
    .aid-home-page .avm-home-teaser .avm-home-teaser-copy h2 { font-size: 32px; }
    .avmx-body { grid-template-columns: minmax(0, 1fr); justify-items: center; gap: 18px; padding: 18px 14px; }
    .avmx-radar { width: 150px; }
    .avmx-feed { width: 100%; }
}
/* Compact mobile. */
@media (max-width: 379.98px) {
    .avmx-radar { width: 128px; }
    .avmx-head { flex-wrap: wrap; }
    .avmx-row { padding: 10px 10px 10px 10px; gap: 10px; grid-template-columns: 30px minmax(0, 1fr); }
    .avmx-row__icon { width: 30px; height: 30px; }
}
@media (max-width: 575.98px) {
    .avmx-head { letter-spacing: .08em; }
    .avmx-live { line-height: 1.4; }
}
@media (max-width: 379.98px) {
    .aid-home-page .avm-home-teaser .avm-home-teaser-copy h2 { font-size: 29px; }
}

/* v451.366: eyebrow "Visual identity" led by a round dot (same dot as the
 * institutional block "Credibility without overstatement"), not a rule. */
body.aid-home-page .avm-home-teaser .avm-home-teaser-copy > span { gap: 12px; }
body.aid-home-page .avm-home-teaser .avm-home-teaser-copy > span::before {
    content: "" !important;
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px;
    margin-left: 5px;
    background: #76ddd9 !important;
    box-shadow: 0 0 0 5px rgba(118, 221, 217, .12);
}
@layer aid-refine {
    body.aid-context-public.aid-home-page .avm-home-teaser .avm-home-teaser-copy > span::before { border-radius: 50% !important; }
}
