/* =========================================================
   DAMIOLINK
   CONTATTI V1
   ========================================================= */

:root {
    --ct-bg: #020c16;
    --ct-bg2: #031321;
    --ct-panel: #051b2e;
    --ct-panel2: #06253d;

    --ct-blue: #009cff;
    --ct-cyan: #14c9ff;

    --ct-text: #f5faff;
    --ct-muted: #8da9bd;

    --ct-line:
        rgba(20, 177, 255, .25);
}


* {
    box-sizing:
        border-box;
}


html {
    margin:
        0;

    padding:
        0;

    background:
        var(--ct-bg);

    scroll-behavior:
        smooth;
}


body {
    margin:
        0;

    color:
        var(--ct-text);

    background:
        var(--ct-bg);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Arial,
        sans-serif;

    -webkit-font-smoothing:
        antialiased;
}


a {
    color:
        inherit;

    text-decoration:
        none;
}


.page-shell {
    width:
        min(
            1460px,
            calc(100% - 80px)
        );

    margin:
        0 auto;
}



/* =========================================================
   HERO
   ========================================================= */

.contact-hero {
    position:
        relative;

    min-height:
        445px;

    overflow:
        hidden;

    border-bottom:
        1px solid
        rgba(0, 157, 235, .17);

    background:
        linear-gradient(
            90deg,
            #020c16 0%,
            #031321 48%,
            #041a2d 76%,
            #020c16 100%
        );
}


.contact-grid {
    position:
        absolute;

    inset:
        0;

    opacity:
        .18;

    background-image:
        linear-gradient(
            rgba(16, 167, 238, .12) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(16, 167, 238, .12) 1px,
            transparent 1px
        );

    background-size:
        55px 55px;

    mask-image:
        linear-gradient(
            90deg,
            transparent,
            black 35%,
            black
        );
}


.contact-glow {
    position:
        absolute;

    border-radius:
        50%;

    pointer-events:
        none;

    filter:
        blur(30px);
}


.contact-glow-a {
    right:
        9%;

    top:
        3%;

    width:
        450px;

    height:
        450px;

    background:
        rgba(0, 143, 255, .09);
}


.contact-glow-b {
    right:
        32%;

    bottom:
        -170px;

    width:
        320px;

    height:
        320px;

    background:
        rgba(0, 206, 255, .04);
}


.hero-layout {
    position:
        relative;

    z-index:
        2;

    min-height:
        445px;

    display:
        grid;

    grid-template-columns:
        .9fr
        1.1fr;

    align-items:
        center;
}


.contact-copy {
    padding:
        55px
        0;
}


.contact-kicker {
    margin-bottom:
        17px;

    color:
        #6fb8df;

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        4px;
}


.contact-copy h1 {
    max-width:
        700px;

    margin:
        0;

    font-size:
        clamp(
            48px,
            4.7vw,
            72px
        );

    line-height:
        .92;

    letter-spacing:
        -3.5px;
}


.contact-copy h1 span,
.contact-copy h1 strong {
    display:
        block;
}


.contact-copy h1 span {
    color:
        #ffffff;

    font-weight:
        900;
}


.contact-copy h1 strong {
    margin-top:
        10px;

    color:
        var(--ct-blue);

    font-weight:
        900;
}


.contact-description {
    max-width:
        590px;

    margin:
        23px
        0
        0;

    color:
        #94adbf;

    font-size:
        14px;

    line-height:
        1.6;
}


.contact-status {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        11px;

    margin-top:
        27px;

    padding:
        9px 13px;

    border:
        1px solid
        rgba(0, 177, 255, .20);

    border-radius:
        5px;

    background:
        rgba(0, 102, 173, .055);
}


.status-dot {
    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        #21d6a4;

    box-shadow:
        0 0 9px
        rgba(33, 214, 164, .75);
}


.contact-status strong,
.contact-status span {
    display:
        block;
}


.contact-status strong {
    color:
        #dff5ff;

    font-size:
        7px;

    letter-spacing:
        1.3px;
}


.contact-status span {
    margin-top:
        3px;

    color:
        #5c8ba6;

    font-size:
        7px;
}



/* =========================================================
   COMMUNICATION VISUAL
   ========================================================= */

.communication-visual {
    position:
        relative;

    min-height:
        405px;
}


.visual-ring {
    position:
        absolute;

    left:
        54%;

    top:
        50%;

    transform:
        translate(
            -50%,
            -50%
        );

    border:
        1px solid
        rgba(0, 179, 255, .17);

    border-radius:
        50%;
}


.ring-a {
    width:
        300px;

    height:
        300px;
}


.ring-b {
    width:
        405px;

    height:
        405px;

    border-style:
        dashed;

    animation:
        ct-ring-spin
        35s
        linear
        infinite;
}


.ring-c {
    width:
        205px;

    height:
        205px;

    border-color:
        rgba(0, 190, 255, .27);
}


@keyframes ct-ring-spin {

    from {
        transform:
            translate(-50%, -50%)
            rotate(0);
    }

    to {
        transform:
            translate(-50%, -50%)
            rotate(360deg);
    }

}


.communication-core {
    position:
        absolute;

    z-index:
        6;

    left:
        54%;

    top:
        50%;

    width:
        105px;

    height:
        105px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    transform:
        translate(-50%, -50%);

    border:
        1px solid
        #13c8ff;

    border-radius:
        50%;

    background:
        radial-gradient(
            circle,
            #07314e,
            #041624 70%
        );

    box-shadow:
        0 0 45px
        rgba(0, 170, 255, .18),
        inset 0 0 30px
        rgba(0, 183, 255, .08);
}


.communication-core svg {
    width:
        39px;

    height:
        39px;

    fill:
        none;

    stroke:
        #19c8ff;

    stroke-width:
        1.4;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.core-pulse {
    position:
        absolute;

    inset:
        -16px;

    border:
        1px solid
        rgba(17, 197, 255, .28);

    border-radius:
        50%;

    animation:
        ct-pulse
        2.6s
        ease-out
        infinite;
}


@keyframes ct-pulse {

    0% {
        transform:
            scale(.82);

        opacity:
            .8;
    }

    100% {
        transform:
            scale(1.45);

        opacity:
            0;
    }

}


.communication-node {
    position:
        absolute;

    z-index:
        5;

    min-width:
        135px;

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    padding:
        9px 11px;

    border:
        1px solid
        rgba(0, 180, 255, .28);

    border-radius:
        4px;

    background:
        rgba(2, 19, 33, .90);

    box-shadow:
        inset 0 0 20px
        rgba(0, 135, 220, .045);
}


.communication-node > i {
    width:
        8px;

    height:
        8px;

    flex-shrink:
        0;

    border-radius:
        50%;

    background:
        #13c8ff;

    box-shadow:
        0 0 9px
        rgba(19, 200, 255, .7);
}


.communication-node strong,
.communication-node span {
    display:
        block;
}


.communication-node strong {
    color:
        #dff6ff;

    font-size:
        7px;

    letter-spacing:
        1.2px;
}


.communication-node span {
    margin-top:
        3px;

    color:
        #4c86a5;

    font-size:
        5px;

    letter-spacing:
        1px;
}


.node-phone {
    left:
        8%;

    top:
        74px;
}


.node-email {
    right:
        1%;

    top:
        73px;
}


.node-support {
    left:
        7%;

    bottom:
        58px;
}


.node-project {
    right:
        0;

    bottom:
        59px;
}


.comm-line {
    position:
        absolute;

    z-index:
        2;

    height:
        1px;

    transform-origin:
        left center;

    background:
        linear-gradient(
            90deg,
            rgba(0, 170, 255, .06),
            rgba(0, 194, 255, .75),
            rgba(0, 170, 255, .06)
        );
}


.comm-line b {
    position:
        absolute;

    top:
        -1px;

    width:
        18px;

    height:
        3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #e8fcff,
            transparent
        );

    opacity:
        .65;

    animation:
        ct-packet
        3.5s
        linear
        infinite;
}


@keyframes ct-packet {

    from {
        left:
            0;
    }

    to {
        left:
            calc(100% - 18px);
    }

}


.line-phone {
    left:
        25%;

    top:
        122px;

    width:
        220px;

    transform:
        rotate(29deg);
}


.line-email {
    left:
        60%;

    top:
        194px;

    width:
        200px;

    transform:
        rotate(-36deg);
}


.line-support {
    left:
        25%;

    top:
        298px;

    width:
        215px;

    transform:
        rotate(-29deg);
}


.line-project {
    left:
        59%;

    top:
        220px;

    width:
        205px;

    transform:
        rotate(35deg);
}


.visual-label {
    position:
        absolute;

    color:
        #356f8e;

    font-size:
        5px;

    letter-spacing:
        1.5px;
}


.label-a {
    right:
        7%;

    top:
        28px;
}


.label-b {
    left:
        40%;

    bottom:
        13px;
}


.label-c {
    left:
        5%;

    top:
        50%;
}



/* =========================================================
   PRIMARY PHONE
   ========================================================= */

.primary-contact-section {
    padding:
        27px
        0
        15px;

    background:
        #020d18;
}


.primary-contact-panel {
    position:
        relative;

    min-height:
        130px;

    display:
        grid;

    grid-template-columns:
        100px
        1fr
        205px
        205px;

    align-items:
        center;

    gap:
        20px;

    overflow:
        hidden;

    padding:
        19px
        26px;

    border:
        1px solid
        rgba(0, 185, 255, .62);

    border-radius:
        10px;

    background:
        linear-gradient(
            90deg,
            #05213a,
            #052c4b 55%,
            #063a60
        );

    box-shadow:
        0 0 32px
        rgba(0, 150, 255, .07),
        inset 0 0 40px
        rgba(0, 134, 231, .06);
}


.primary-contact-panel::before {
    content:
        "";

    position:
        absolute;

    right:
        8%;

    top:
        -130px;

    width:
        400px;

    height:
        280px;

    border-radius:
        50%;

    background:
        radial-gradient(
            circle,
            rgba(0, 194, 255, .13),
            transparent 68%
        );
}


.primary-icon {
    position:
        relative;

    width:
        72px;

    height:
        72px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        var(--ct-cyan);

    border-radius:
        50%;

    background:
        rgba(0, 113, 190, .12);

    box-shadow:
        0 0 25px
        rgba(0, 182, 255, .10);
}


.primary-icon svg {
    width:
        31px;

    height:
        31px;

    fill:
        none;

    stroke:
        #18c8ff;

    stroke-width:
        1.5;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.icon-ring {
    position:
        absolute;

    inset:
        -7px;

    border:
        1px solid
        rgba(0, 198, 255, .18);

    border-radius:
        50%;
}


.contact-label {
    color:
        #13c7ff;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        2.2px;
}


.primary-contact-copy h2 {
    margin:
        5px
        0
        3px;

    color:
        #ffffff;

    font-size:
        31px;

    letter-spacing:
        -.8px;
}


.primary-contact-copy p {
    margin:
        0;

    color:
        #86a5b9;

    font-size:
        10px;
}


.phone-status {
    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    padding-left:
        23px;

    border-left:
        1px solid
        rgba(0, 177, 255, .25);
}


.phone-status-dot {
    width:
        8px;

    height:
        8px;

    flex-shrink:
        0;

    border-radius:
        50%;

    background:
        #25d6a5;

    box-shadow:
        0 0 9px
        rgba(37, 214, 165, .7);
}


.phone-status strong,
.phone-status small {
    display:
        block;
}


.phone-status strong {
    color:
        #d9f4ff;

    font-size:
        8px;

    letter-spacing:
        1.1px;
}


.phone-status small {
    margin-top:
        3px;

    color:
        #5086a2;

    font-size:
        5px;

    letter-spacing:
        1px;
}


.call-button {
    position:
        relative;

    z-index:
        2;

    min-height:
        52px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    padding:
        0 18px;

    border:
        1px solid
        #28d0ff;

    border-radius:
        7px;

    color:
        #ffffff;

    background:
        linear-gradient(
            90deg,
            #0874ff,
            #0ab4f6
        );

    box-shadow:
        0 0 21px
        rgba(0, 166, 255, .20);

    font-size:
        10px;

    font-weight:
        800;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.call-button:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 0 30px
        rgba(0, 183, 255, .32);
}


.call-button svg {
    width:
        19px;

    height:
        19px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.6;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.call-button b {
    margin-left:
        5px;

    font-size:
        18px;
}



/* =========================================================
   DETAILS
   ========================================================= */

.contact-details {
    padding:
        0
        0
        15px;

    background:
        #020d18;
}


.details-grid {
    display:
        grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap:
        15px;
}


.detail-card {
    position:
        relative;

    min-height:
        225px;

    overflow:
        hidden;

    padding:
        22px 24px;

    border:
        1px solid
        rgba(0, 151, 235, .40);

    border-radius:
        9px;

    background:
        linear-gradient(
            145deg,
            rgba(5, 34, 57, .98),
            rgba(2, 18, 31, .99)
        );

    box-shadow:
        inset 0 0 40px
        rgba(0, 108, 187, .045);
}


.detail-card::before {
    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    top:
        0;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(19, 200, 255, .65),
            transparent
        );
}


.detail-number {
    position:
        absolute;

    right:
        20px;

    top:
        15px;

    color:
        rgba(46, 156, 214, .25);

    font-size:
        31px;

    font-weight:
        800;
}


.detail-icon {
    width:
        46px;

    height:
        46px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    margin-bottom:
        12px;

    border:
        1px solid
        rgba(13, 184, 255, .70);

    border-radius:
        7px;

    background:
        rgba(0, 97, 166, .10);
}


.detail-icon svg {
    width:
        23px;

    height:
        23px;

    fill:
        none;

    stroke:
        #16bdff;

    stroke-width:
        1.6;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.detail-kicker {
    color:
        #3e8aaf;

    font-size:
        6px;

    font-weight:
        800;

    letter-spacing:
        1.7px;
}


.detail-card h3 {
    margin:
        4px
        0
        7px;

    color:
        #ffffff;

    font-size:
        17px;
}


.detail-value {
    display:
        inline-block;

    color:
        #1bc5ff;

    font-size:
        20px;

    font-weight:
        750;

    transition:
        color .2s ease;
}


.detail-value:hover {
    color:
        #ffffff;
}


.detail-card p {
    max-width:
        500px;

    margin:
        8px
        0
        0;

    color:
        #829fb3;

    font-size:
        9px;

    line-height:
        1.5;
}


.detail-action {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;

    margin-top:
        14px;

    color:
        #cfefff;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .6px;
}


.detail-action span {
    color:
        #15c6ff;

    font-size:
        15px;
}


.hours {
    max-width:
        400px;

    margin-top:
        4px;
}


.hours > div {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    padding:
        9px
        12px;

    border:
        1px solid
        rgba(0, 158, 235, .17);

    border-radius:
        4px;

    background:
        rgba(0, 104, 170, .045);
}


.hours span {
    color:
        #8aa9bc;

    font-size:
        9px;
}


.hours strong {
    color:
        #e8f8ff;

    font-size:
        10px;
}


.detail-status {
    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    margin-top:
        15px;

    color:
        #5d94b0;

    font-size:
        6px;

    font-weight:
        700;

    letter-spacing:
        1px;
}


.detail-status i {
    width:
        6px;

    height:
        6px;

    border-radius:
        50%;

    background:
        #19c8ff;

    box-shadow:
        0 0 7px
        rgba(25, 200, 255, .55);
}



/* =========================================================
   REMOTE SUPPORT
   ========================================================= */

.remote-section {
    padding:
        0
        0
        15px;

    background:
        #020d18;
}


.remote-panel {
    min-height:
        130px;

    display:
        grid;

    grid-template-columns:
        150px
        1fr
        285px;

    align-items:
        center;

    gap:
        24px;

    padding:
        17px 28px;

    border:
        1px solid
        rgba(0, 177, 255, .52);

    border-radius:
        10px;

    background:
        linear-gradient(
            90deg,
            #041a2d,
            #052944 57%,
            #053657
        );

    box-shadow:
        inset 0 0 40px
        rgba(0, 130, 220, .05);
}


.remote-visual {
    position:
        relative;

    width:
        112px;

    height:
        86px;

    margin:
        0 auto;
}


.remote-screen {
    width:
        110px;

    height:
        70px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(20, 201, 255, .72);

    border-radius:
        5px;

    background:
        #03111e;

    box-shadow:
        0 0 18px
        rgba(0, 183, 255, .09);
}


.screen-top {
    height:
        12px;

    display:
        flex;

    align-items:
        center;

    gap:
        3px;

    padding:
        0 5px;

    border-bottom:
        1px solid
        rgba(0, 160, 235, .20);

    background:
        #061d2e;
}


.screen-top i {
    width:
        3px;

    height:
        3px;

    border-radius:
        50%;

    background:
        #4a7e98;
}


.screen-content {
    position:
        relative;

    height:
        57px;

    padding:
        8px;
}


.screen-link {
    display:
        flex;

    gap:
        4px;
}


.screen-link span {
    width:
        24px;

    height:
        2px;

    background:
        #125474;
}


.screen-link span:last-child {
    width:
        14px;
}


.screen-pulse {
    position:
        absolute;

    right:
        11px;

    top:
        13px;

    width:
        21px;

    height:
        21px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(21, 200, 255, .35);

    border-radius:
        50%;
}


.screen-pulse i {
    width:
        6px;

    height:
        6px;

    border-radius:
        50%;

    background:
        #1bd6a2;

    box-shadow:
        0 0 7px
        rgba(27, 214, 162, .7);
}


.screen-content strong,
.screen-content small {
    display:
        block;
}


.screen-content strong {
    margin-top:
        12px;

    color:
        #cbefff;

    font-size:
        5px;

    letter-spacing:
        .7px;
}


.screen-content small {
    margin-top:
        3px;

    color:
        #397d9e;

    font-size:
        4px;
}


.remote-base {
    position:
        absolute;

    left:
        42px;

    bottom:
        2px;

    width:
        28px;

    height:
        7px;

    border-bottom:
        1px solid
        rgba(18, 190, 255, .60);

    border-left:
        5px solid transparent;

    border-right:
        5px solid transparent;
}


.remote-copy {
    padding-left:
        25px;

    border-left:
        1px solid
        rgba(18, 160, 238, .25);
}


.remote-copy > span {
    color:
        #12c4ff;

    font-size:
        6px;

    font-weight:
        800;

    letter-spacing:
        2px;
}


.remote-copy h2 {
    margin:
        4px
        0;

    color:
        #ffffff;

    font-size:
        20px;
}


.remote-copy p {
    max-width:
        650px;

    margin:
        0;

    color:
        #89a6b9;

    font-size:
        9px;

    line-height:
        1.5;
}


.remote-action {
    min-height:
        52px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    padding:
        0 17px;

    border:
        1px solid
        #28d0ff;

    border-radius:
        7px;

    color:
        #ffffff;

    background:
        linear-gradient(
            90deg,
            #0874ff,
            #0ab4f6
        );

    box-shadow:
        0 0 21px
        rgba(0, 166, 255, .18);

    font-size:
        9px;

    font-weight:
        800;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.remote-action:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 0 28px
        rgba(0, 183, 255, .30);
}


.remote-action svg {
    width:
        19px;

    height:
        19px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.6;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.remote-action b {
    margin-left:
        5px;

    font-size:
        17px;
}



/* =========================================================
   FUTURE COMMUNICATION
   ========================================================= */

.future-section {
    padding:
        0
        0
        15px;

    background:
        #020d18;
}


.future-panel {
    padding:
        17px
        25px;

    border:
        1px solid
        rgba(0, 145, 220, .21);

    border-radius:
        8px;

    background:
        rgba(4, 24, 40, .64);
}


.future-heading {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        30px;
}


.future-heading span {
    color:
        #3f86a8;

    font-size:
        5px;

    font-weight:
        800;

    letter-spacing:
        1.8px;
}


.future-heading h2 {
    margin:
        4px
        0
        0;

    color:
        #dceef8;

    font-size:
        14px;

    font-weight:
        600;
}


.future-code {
    color:
        #376e8a;

    font-size:
        5px;

    letter-spacing:
        1.4px;
}


.future-line {
    display:
        grid;

    grid-template-columns:
        1fr
        90px
        1fr
        90px
        1fr;

    align-items:
        center;

    max-width:
        800px;

    margin:
        16px
        auto
        0;
}


.future-node {
    text-align:
        center;

    opacity:
        .45;
}


.future-node.active {
    opacity:
        1;
}


.future-node i {
    display:
        block;

    width:
        7px;

    height:
        7px;

    margin:
        0 auto
        6px;

    border:
        1px solid
        #18c7ff;

    border-radius:
        50%;
}


.future-node.active i {
    background:
        #18c7ff;

    box-shadow:
        0 0 8px
        rgba(24, 199, 255, .65);
}


.future-node strong,
.future-node span {
    display:
        block;
}


.future-node strong {
    color:
        #d6f0fb;

    font-size:
        6px;

    letter-spacing:
        1.1px;
}


.future-node span {
    margin-top:
        3px;

    color:
        #527e96;

    font-size:
        5px;
}


.future-link {
    position:
        relative;

    height:
        1px;

    background:
        rgba(0, 177, 255, .20);
}


.future-link i {
    position:
        absolute;

    right:
        -1px;

    top:
        -2px;

    width:
        5px;

    height:
        5px;

    border-radius:
        50%;

    background:
        #0faee8;
}



/* =========================================================
   LEGAL OFFICE
   ========================================================= */

.legal-section {
    padding:
        0
        0
        13px;

    background:
        #020d18;
}


.legal-panel {
    min-height:
        64px;

    display:
        grid;

    grid-template-columns:
        46px
        1fr
        auto;

    align-items:
        center;

    gap:
        14px;

    padding:
        9px
        18px;

    border-top:
        1px solid
        rgba(53, 116, 158, .18);

    border-bottom:
        1px solid
        rgba(53, 116, 158, .18);
}


.legal-mark {
    width:
        36px;

    height:
        36px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(0, 161, 235, .20);

    border-radius:
        5px;
}


.legal-mark svg {
    width:
        18px;

    height:
        18px;

    fill:
        none;

    stroke:
        #4f8daa;

    stroke-width:
        1.5;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.legal-copy span,
.legal-copy strong {
    display:
        block;
}


.legal-copy span {
    color:
        #4b7d98;

    font-size:
        5px;

    font-weight:
        800;

    letter-spacing:
        1.3px;
}


.legal-copy strong {
    margin-top:
        4px;

    color:
        #90aabd;

    font-size:
        8px;

    font-weight:
        600;
}


.legal-note {
    color:
        #466f87;

    font-size:
        5px;

    letter-spacing:
        1px;
}



/* =========================================================
   FOOTER
   ========================================================= */

.contact-footer {
    padding:
        0;

    background:
        #020d18;

    text-align:
        center;
}


.footer-line {
    height:
        1px;

    margin-bottom:
        11px;

    background:
        linear-gradient(
            90deg,
            rgba(25, 137, 202, .42),
            transparent 40%,
            transparent 60%,
            rgba(25, 137, 202, .42)
        );
}


.footer-brand {
    font-size:
        23px;

    font-weight:
        850;

    letter-spacing:
        -1.4px;
}


.footer-brand span {
    color:
        #ffffff;
}


.footer-brand strong {
    color:
        #0baaff;
}


.footer-tagline {
    margin-top:
        4px;

    color:
        #9bb3c7;

    font-size:
        6px;

    font-weight:
        700;

    letter-spacing:
        2.6px;
}


.footer-bottom {
    display:
        flex;

    justify-content:
        space-between;

    margin-top:
        14px;

    padding:
        12px
        0
        22px;

    border-top:
        1px solid
        rgba(47, 113, 159, .15);

    color:
        #55758f;

    font-size:
        8px;
}



/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1250px) {

    .page-shell {
        width:
            min(
                calc(100% - 44px),
                1460px
            );
    }


    .primary-contact-panel {
        grid-template-columns:
            90px
            1fr
            180px
            190px;
    }

}


@media (max-width: 1050px) {

    .hero-layout {
        grid-template-columns:
            1fr;
    }


    .communication-visual {
        min-height:
            390px;
    }


    .primary-contact-panel {
        grid-template-columns:
            90px
            1fr
            190px;
    }


    .phone-status {
        display:
            none;
    }


    .remote-panel {
        grid-template-columns:
            130px
            1fr;
    }


    .remote-action {
        grid-column:
            1 / -1;
    }

}


@media (max-width: 700px) {

    .page-shell {
        width:
            calc(100% - 28px);
    }


    .contact-hero {
        min-height:
            auto;
    }


    .hero-layout {
        min-height:
            auto;
    }


    .contact-copy {
        padding:
            48px
            0
            20px;
    }


    .contact-kicker {
        font-size:
            7px;

        letter-spacing:
            2.6px;
    }


    .contact-copy h1 {
        font-size:
            46px;

        letter-spacing:
            -2.7px;
    }


    .contact-description {
        font-size:
            13px;
    }


    .communication-visual {
        min-height:
            355px;

        transform:
            scale(.86);

        transform-origin:
            top center;
    }


    .primary-contact-panel {
        display:
            flex;

        flex-direction:
            column;

        align-items:
            stretch;

        text-align:
            center;

        padding:
            22px;
    }


    .primary-icon {
        margin:
            0 auto;
    }


    .primary-contact-copy h2 {
        font-size:
            27px;
    }


    .call-button {
        margin-top:
            4px;
    }


    .details-grid {
        grid-template-columns:
            1fr;
    }


    .detail-value {
        font-size:
            17px;
    }


    .remote-panel {
        display:
            flex;

        flex-direction:
            column;

        align-items:
            stretch;

        text-align:
            center;

        padding:
            21px;
    }


    .remote-copy {
        padding:
            0;

        border-left:
            0;
    }


    .future-heading {
        display:
            block;
    }


    .future-code {
        margin-top:
            7px;
    }


    .future-line {
        grid-template-columns:
            1fr;

        gap:
            11px;
    }


    .future-link {
        width:
            1px;

        height:
            16px;

        margin:
            0 auto;
    }


    .future-link i {
        left:
            -2px;

        right:
            auto;

        bottom:
            -1px;

        top:
            auto;
    }


    .legal-panel {
        grid-template-columns:
            42px
            1fr;
    }


    .legal-note {
        display:
            none;
    }


    .footer-bottom {
        flex-direction:
            column;

        gap:
            6px;
    }

}


@media (prefers-reduced-motion: reduce) {

    .ring-b,
    .core-pulse,
    .comm-line b {
        animation:
            none;
    }

}