/* G3 Dual Platform Front Page */
.g3-dpf {
    --g3-navy: #061421;
    --g3-red: #d80b12;
    --g3-teal: #007d98;
    width: 100vw;
    max-width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 0;
    margin-bottom: 0;
    background: var(--g3-navy);
    overflow: hidden;
    line-height: 1;
}

.g3-dpf__canvas {
    position: relative;
    width: 100%;
    max-width: 1672px;
    margin: 0 auto;
    background: var(--g3-navy);
}

.g3-dpf__image {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
}

.g3-dpf__hotspot {
    position: absolute;
    display: block;
    z-index: 5;
    border-radius: 6px;
    text-decoration: none !important;
    background: transparent;
}

.g3-dpf__hotspot:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 2px;
    box-shadow: 0 0 0 6px rgba(0, 125, 152, .72);
}

/* Top navigation / brand hotspots, positioned as percentages of the approved 1672x941 artwork. */
.g3-dpf__logo          { left: 1.6%; top: 0.7%; width: 16.0%; height: 6.2%; }
.g3-dpf__nav-home      { left: 53.1%; top: 0.8%; width: 5.6%;  height: 6.0%; }
.g3-dpf__nav-argus     { left: 59.7%; top: 0.8%; width: 5.4%;  height: 6.0%; }
.g3-dpf__nav-smart     { left: 66.3%; top: 0.8%; width: 5.5%;  height: 6.0%; }
.g3-dpf__nav-about     { left: 72.9%; top: 0.8%; width: 5.0%;  height: 6.0%; }
.g3-dpf__nav-solutions { left: 79.2%; top: 0.8%; width: 7.1%;  height: 6.0%; }
.g3-dpf__nav-contact   { left: 88.4%; top: 0.8%; width: 8.9%;  height: 6.0%; }

/* Main hero buttons. */
.g3-dpf__cta-argus { left: 2.45%; top: 49.7%; width: 12.7%; height: 6.0%; }
.g3-dpf__cta-smart { left: 51.6%; top: 51.3%; width: 13.0%; height: 6.0%; }

/* Bottom platform summary cards. */
.g3-dpf__card-argus { left: 1.7%; top: 79.0%; width: 44.7%; height: 15.8%; }
.g3-dpf__card-smart { left: 51.6%; top: 79.0%; width: 46.5%; height: 15.8%; }

.g3-dpf__mobile-ctas {
    display: none;
    gap: 12px;
    padding: 16px;
    background: #071421;
}

.g3-dpf__mobile-button {
    flex: 1 1 0;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 48px;
    padding: 12px 16px;
    border-radius: 5px;
    color: #fff !important;
    font: 700 15px/1.2 Arial, Helvetica, sans-serif;
    text-decoration: none !important;
    text-align: center;
}
.g3-dpf__mobile-button--argus { background: var(--g3-red); }
.g3-dpf__mobile-button--smart { background: var(--g3-teal); }

@media (max-width: 760px) {
    .g3-dpf__mobile-ctas { display: flex; }
    .g3-dpf__nav-home,
    .g3-dpf__nav-argus,
    .g3-dpf__nav-smart,
    .g3-dpf__nav-about,
    .g3-dpf__nav-solutions,
    .g3-dpf__nav-contact { display: none; }
}

@media (max-width: 480px) {
    .g3-dpf__mobile-ctas { flex-direction: column; }
}