:root {
    --datmit-bg: #ffffff;
    --datmit-text: #101820;
    --datmit-muted: #66727d;
    --datmit-line: #e6eaed;
    --datmit-dark: #071018;
    --datmit-accent: #00a8e8;
    --datmit-max: 1440px;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--datmit-bg);
    color: var(--datmit-text);
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
}

.datmit-header {
    width: 100%;
    border-bottom: 1px solid var(--datmit-line);
    background: rgba(255,255,255,.96);
}

.datmit-header-inner {
    max-width: var(--datmit-max);
    margin: 0 auto;
    padding: 20px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.datmit-brand {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.04em;
}

.datmit-nav {
    display: flex;
    align-items: center;
    gap: 28px;
    font-size: 15px;
}

.datmit-nav a {
    text-decoration: none;
}

.datmit-nav a:hover {
    opacity: .65;
}

.datmit-support {
    display: inline-flex;
    align-items: center;
    padding: 10px 16px;
    border-radius: 999px;
    background: var(--datmit-dark);
    color: #fff;
    text-decoration: none;
    font-size: 14px;
}

@media (max-width: 900px) {
    .datmit-header-inner {
        padding: 18px 20px;
    }

    .datmit-nav {
        display: none;
    }
}

/* =========================================================
   HOMEPAGE
   ========================================================= */

.datmit-hero {
    position: relative;
    min-height: calc(100vh - 82px);
    display: flex;
    align-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 75% 35%, rgba(0,168,232,.14), transparent 32%),
        radial-gradient(circle at 85% 70%, rgba(0,168,232,.08), transparent 26%),
        var(--datmit-dark);
    color: #fff;
}

.datmit-hero-network {
    position: absolute;
    inset: 0;
    opacity: .18;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(to right, transparent, #000 35%, #000);
}

.datmit-hero-inner {
    position: relative;
    z-index: 2;
    width: min(calc(100% - 64px), var(--datmit-max));
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0,1.15fr) minmax(380px,.85fr);
    gap: 80px;
    align-items: center;
    padding: 90px 0;
}

.datmit-eyebrow,
.datmit-section-label {
    margin: 0 0 24px;
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: .16em;
    font-weight: 700;
}

.datmit-eyebrow {
    color: rgba(255,255,255,.58);
}

.datmit-hero h1 {
    margin: 0;
    max-width: 900px;
    font-size: clamp(56px, 7vw, 112px);
    line-height: .88;
    font-weight: 600;
    letter-spacing: -.065em;
}

.datmit-hero-text {
    max-width: 690px;
    margin: 40px 0 0;
    color: rgba(255,255,255,.7);
    font-size: clamp(18px, 1.5vw, 22px);
    line-height: 1.55;
}

.datmit-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 42px;
}

.datmit-button-primary,
.datmit-button-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 22px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: transform .2s ease, opacity .2s ease, background .2s ease;
}

.datmit-button-primary {
    background: #fff;
    color: var(--datmit-dark);
}

.datmit-button-secondary {
    border: 1px solid rgba(255,255,255,.28);
    color: #fff;
}

.datmit-button-primary:hover,
.datmit-button-secondary:hover {
    transform: translateY(-2px);
}

.datmit-hero-visual {
    position: relative;
    width: min(36vw, 560px);
    aspect-ratio: 1;
    justify-self: end;
}

.datmit-core {
    position: absolute;
    width: 22%;
    aspect-ratio: 1;
    border-radius: 50%;
    left: 39%;
    top: 39%;
    background: #fff;
    box-shadow:
        0 0 50px rgba(0,168,232,.8),
        0 0 120px rgba(0,168,232,.38);
}

.datmit-orbit {
    position: absolute;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 50%;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.datmit-orbit-1 {
    width: 42%;
    height: 42%;
}

.datmit-orbit-2 {
    width: 68%;
    height: 68%;
}

.datmit-orbit-3 {
    width: 94%;
    height: 94%;
}

.datmit-node {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--datmit-accent);
    box-shadow: 0 0 24px rgba(0,168,232,.8);
}

.datmit-node-1 {
    left: 8%;
    top: 48%;
}

.datmit-node-2 {
    right: 12%;
    top: 22%;
}

.datmit-node-3 {
    right: 4%;
    bottom: 24%;
}

.datmit-node-4 {
    left: 29%;
    bottom: 5%;
}

.datmit-intro {
    padding: 140px 32px;
    background: #fff;
}

.datmit-section-inner {
    max-width: var(--datmit-max);
    margin: 0 auto;
}

.datmit-section-label {
    color: var(--datmit-muted);
}

.datmit-intro h2 {
    margin: 0;
    max-width: 1050px;
    font-size: clamp(48px, 6vw, 96px);
    line-height: .98;
    letter-spacing: -.055em;
    font-weight: 500;
}

.datmit-intro-text {
    max-width: 760px;
    margin: 48px 0 0 auto;
    font-size: clamp(20px, 2vw, 28px);
    line-height: 1.45;
    color: var(--datmit-muted);
}

.datmit-divisions {
    padding: 120px 32px 160px;
    background: #f4f6f7;
}

.datmit-division-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    border-top: 1px solid #ccd3d8;
}

.datmit-division-card {
    position: relative;
    min-height: 290px;
    padding: 42px;
    border-bottom: 1px solid #ccd3d8;
    text-decoration: none;
    transition: background .25s ease, transform .25s ease;
}

.datmit-division-card:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-division-card:hover {
    background: #fff;
}

.datmit-division-card > span {
    display: block;
    margin-bottom: 56px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-division-card h3 {
    margin: 0 0 16px;
    font-size: clamp(34px, 4vw, 60px);
    font-weight: 500;
    letter-spacing: -.045em;
}

.datmit-division-card p {
    max-width: 500px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

@media (max-width: 1000px) {

    .datmit-hero-inner {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .datmit-hero-visual {
        width: min(70vw, 480px);
        justify-self: center;
    }

}

@media (max-width: 700px) {

    .datmit-hero-inner {
        width: calc(100% - 40px);
        padding: 70px 0;
    }

    .datmit-hero h1 {
        font-size: clamp(48px, 15vw, 72px);
    }

    .datmit-intro,
    .datmit-divisions {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-division-grid {
        grid-template-columns: 1fr;
    }

    .datmit-division-card:nth-child(odd) {
        border-right: 0;
    }

    .datmit-division-card {
        min-height: auto;
        padding: 32px 0;
    }

}

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

.datmit-footer {
    background: #050b10;
    color: #fff;
    padding: 90px 32px 32px;
}

.datmit-footer-inner {
    max-width: var(--datmit-max);
    margin: 0 auto;
}

.datmit-footer-main {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 100px;
    padding-bottom: 80px;
}

.datmit-footer-logo {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -.04em;
}

.datmit-footer-brand p {
    max-width: 430px;
    margin: 24px 0 0;
    color: rgba(255,255,255,.55);
    font-size: 18px;
    line-height: 1.55;
}

.datmit-footer-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 48px;
}

.datmit-footer-column {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.datmit-footer-column h4 {
    margin: 0 0 10px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: rgba(255,255,255,.45);
}

.datmit-footer-column a {
    color: #fff;
    text-decoration: none;
    font-size: 15px;
}

.datmit-footer-column a:hover {
    opacity: .65;
}

.datmit-footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.5);
    font-size: 13px;
}

.datmit-footer-legal {
    display: flex;
    gap: 10px;
}

.datmit-footer-legal a {
    color: inherit;
    text-decoration: none;
}

@media (max-width: 900px) {

    .datmit-footer-main {
        grid-template-columns: 1fr;
        gap: 60px;
    }

}

@media (max-width: 650px) {

    .datmit-footer {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-footer-columns {
        grid-template-columns: 1fr 1fr;
    }

    .datmit-footer-bottom {
        flex-direction: column;
    }

}

/* =========================================================
   INTERNAL PAGES
   ========================================================= */

.datmit-page {
    background: #fff;
}

.datmit-page-hero {
    padding: 150px 32px 130px;
    background: var(--datmit-dark);
    color: #fff;
}

.datmit-page-hero-inner {
    max-width: var(--datmit-max);
    margin: 0 auto;
}

.datmit-page-label {
    margin: 0 0 34px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .18em;
    color: rgba(255,255,255,.5);
}

.datmit-page-hero h1 {
    max-width: 1200px;
    margin: 0;
    font-size: clamp(54px, 7vw, 108px);
    line-height: .95;
    letter-spacing: -.06em;
    font-weight: 500;
}

.datmit-page-lead {
    max-width: 760px;
    margin: 55px 0 0 auto;
    font-size: clamp(19px, 2vw, 27px);
    line-height: 1.5;
    color: rgba(255,255,255,.65);
}

.datmit-company-intro,
.datmit-company-competence {
    padding: 140px 32px;
}

.datmit-company-grid {
    display: grid;
    grid-template-columns: .4fr 1fr;
    gap: 90px;
}

.datmit-company-copy h2,
.datmit-company-competence h2 {
    margin: 0 0 50px;
    font-size: clamp(42px, 5vw, 76px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-company-copy p {
    max-width: 780px;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-company-pillars {
    padding: 120px 32px;
    background: #f4f6f7;
}

.datmit-pillar-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    margin-top: 50px;
    border-top: 1px solid #ccd3d8;
}

.datmit-pillar {
    padding: 38px 28px 45px;
    border-right: 1px solid #ccd3d8;
}

.datmit-pillar:last-child {
    border-right: 0;
}

.datmit-pillar span {
    display: block;
    margin-bottom: 70px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-pillar h3 {
    margin: 0 0 20px;
    font-size: 30px;
    font-weight: 500;
    letter-spacing: -.03em;
}

.datmit-pillar p {
    margin: 0;
    color: var(--datmit-muted);
    line-height: 1.6;
}

.datmit-competence-list {
    margin-top: 60px;
    border-top: 1px solid var(--datmit-line);
}

.datmit-competence-list div {
    padding: 22px 0;
    border-bottom: 1px solid var(--datmit-line);
    font-size: clamp(21px,2vw,30px);
}

.datmit-company-certifications {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

.datmit-cert-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    margin-top: 55px;
    border-top: 1px solid rgba(255,255,255,.15);
}

.datmit-cert-item {
    padding: 45px 30px;
    border-bottom: 1px solid rgba(255,255,255,.15);
}

.datmit-cert-item:nth-child(odd) {
    border-right: 1px solid rgba(255,255,255,.15);
}

.datmit-cert-item strong {
    display: block;
    margin-bottom: 12px;
    font-size: 28px;
    font-weight: 500;
}

.datmit-cert-item span {
    color: rgba(255,255,255,.55);
}

.datmit-page-cta {
    padding: 140px 32px;
}

.datmit-page-cta h2 {
    max-width: 1100px;
    margin: 0 0 55px;
    font-size: clamp(44px,6vw,88px);
    line-height: .98;
    letter-spacing: -.055em;
    font-weight: 500;
}

.datmit-button-dark {
    display: inline-flex;
    align-items: center;
    min-height: 52px;
    padding: 0 24px;
    border-radius: 999px;
    background: var(--datmit-dark);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
}

@media (max-width: 900px) {

    .datmit-company-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .datmit-pillar-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .datmit-pillar:nth-child(2) {
        border-right: 0;
    }

}

@media (max-width: 600px) {

    .datmit-page-hero,
    .datmit-company-intro,
    .datmit-company-pillars,
    .datmit-company-competence,
    .datmit-company-certifications,
    .datmit-page-cta {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-pillar-grid,
    .datmit-cert-grid {
        grid-template-columns: 1fr;
    }

    .datmit-pillar,
    .datmit-pillar:nth-child(2),
    .datmit-cert-item:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   SERVICES
   ========================================================= */

.datmit-services-intro {
    padding: 130px 32px 150px;
}

.datmit-services-grid {
    margin-top: 55px;
    border-top: 1px solid var(--datmit-line);
}

.datmit-service-block {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 40px;
    padding: 46px 0;
    border-bottom: 1px solid var(--datmit-line);
    color: inherit;
    text-decoration: none;
    transition: padding-left .25s ease, background .25s ease;
}

.datmit-service-block:hover {
    padding-left: 18px;
}

.datmit-service-number {
    padding-top: 10px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-service-block h2 {
    margin: 0 0 14px;
    font-size: clamp(40px, 5vw, 72px);
    line-height: .95;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-service-block p {
    max-width: 760px;
    margin: 0;
    color: var(--datmit-muted);
    font-size: 18px;
    line-height: 1.6;
}

.datmit-services-method {
    padding: 130px 32px;
    background: #f4f6f7;
}

.datmit-services-method h2 {
    margin: 0;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

@media (max-width: 650px) {

    .datmit-services-intro,
    .datmit-services-method {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-service-block {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .datmit-service-block:hover {
        padding-left: 0;
    }

}

/* =========================================================
   CONTACT
   ========================================================= */

.datmit-contact {
    padding: 130px 32px 150px;
}

.datmit-contact-grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 110px;
}

.datmit-contact-intro h2 {
    margin: 0 0 36px;
    font-size: clamp(42px, 5vw, 74px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-contact-intro p:last-child {
    max-width: 620px;
    font-size: 20px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-contact-details {
    border-top: 1px solid var(--datmit-line);
}

.datmit-contact-item {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 30px;
    padding: 30px 0;
    border-bottom: 1px solid var(--datmit-line);
}

.datmit-contact-item span {
    color: var(--datmit-muted);
    font-size: 14px;
}

.datmit-contact-item strong {
    font-size: 21px;
    line-height: 1.5;
    font-weight: 500;
}

.datmit-contact-item a {
    color: inherit;
    text-decoration: none;
}

.datmit-contact-item a:hover {
    opacity: .6;
}

.datmit-contact-cta {
    padding: 130px 32px 150px;
    background: #f4f6f7;
}

.datmit-contact-cta h2 {
    max-width: 1050px;
    margin: 0 0 50px;
    font-size: clamp(46px, 6vw, 88px);
    line-height: .98;
    letter-spacing: -.055em;
    font-weight: 500;
}

@media (max-width: 900px) {

    .datmit-contact-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

}

@media (max-width: 650px) {

    .datmit-contact,
    .datmit-contact-cta {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-contact-item {
        grid-template-columns: 1fr;
        gap: 8px;
    }

}

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

.datmit-support-page {
    padding: 130px 32px 150px;
}

.datmit-support-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--datmit-line);
}

.datmit-support-card {
    padding: 48px 44px 60px;
    border-bottom: 1px solid var(--datmit-line);
}

.datmit-support-card:first-child {
    border-right: 1px solid var(--datmit-line);
}

.datmit-support-card > span {
    display: block;
    margin-bottom: 70px;
    color: var(--datmit-muted);
    font-size: 12px;
}

.datmit-support-card h2 {
    margin: 0 0 22px;
    font-size: clamp(38px, 5vw, 68px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-support-card p {
    max-width: 580px;
    margin: 0 0 34px;
    color: var(--datmit-muted);
    font-size: 18px;
    line-height: 1.6;
}

.datmit-support-info {
    padding: 120px 32px 140px;
    background: #f4f6f7;
}

.datmit-support-notes {
    margin-top: 50px;
    border-top: 1px solid #ccd3d8;
}

.datmit-support-notes > div {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 30px;
    padding: 28px 0;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-support-notes strong {
    font-size: 13px;
    font-weight: 500;
    color: var(--datmit-muted);
}

.datmit-support-notes p {
    max-width: 780px;
    margin: 0;
    font-size: 19px;
    line-height: 1.6;
}

@media (max-width: 700px) {

    .datmit-support-page,
    .datmit-support-info {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-support-grid {
        grid-template-columns: 1fr;
    }

    .datmit-support-card:first-child {
        border-right: 0;
    }

}

/* =========================================================
   SECURITY
   ========================================================= */

.datmit-security-intro {
    padding: 130px 32px 140px;
}

.datmit-security-intro h2,
.datmit-security-response h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-security-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-security-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-security-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-security-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-security-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-security-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-security-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-security-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-security-response {
    padding: 130px 32px;
}

.datmit-security-trust {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

@media (max-width: 700px) {

    .datmit-security-intro,
    .datmit-security-services,
    .datmit-security-response,
    .datmit-security-trust {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-security-grid {
        grid-template-columns: 1fr;
    }

    .datmit-security-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   IT
   ========================================================= */

.datmit-it-intro {
    padding: 130px 32px 140px;
}

.datmit-it-intro h2,
.datmit-it-platform h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-it-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-it-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-it-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-it-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-it-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-it-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-it-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-it-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-it-platform {
    padding: 130px 32px;
}

.datmit-it-management {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

@media (max-width: 700px) {

    .datmit-it-intro,
    .datmit-it-services,
    .datmit-it-platform,
    .datmit-it-management {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-it-grid {
        grid-template-columns: 1fr;
    }

    .datmit-it-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   IT
   ========================================================= */

.datmit-it-intro {
    padding: 130px 32px 140px;
}

.datmit-it-intro h2,
.datmit-it-platform h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-it-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-it-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-it-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-it-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-it-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-it-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-it-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-it-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-it-platform {
    padding: 130px 32px;
}

.datmit-it-management {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

@media (max-width: 700px) {

    .datmit-it-intro,
    .datmit-it-services,
    .datmit-it-platform,
    .datmit-it-management {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-it-grid {
        grid-template-columns: 1fr;
    }

    .datmit-it-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   SYSTEMS
   ========================================================= */

.datmit-systems-intro {
    padding: 130px 32px 140px;
}

.datmit-systems-intro h2,
.datmit-systems-integration h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-systems-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-systems-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-systems-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-systems-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-systems-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-systems-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-systems-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-systems-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-systems-integration {
    padding: 130px 32px;
}

.datmit-systems-compliance {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

@media (max-width: 700px) {

    .datmit-systems-intro,
    .datmit-systems-services,
    .datmit-systems-integration,
    .datmit-systems-compliance {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-systems-grid {
        grid-template-columns: 1fr;
    }

    .datmit-systems-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   CONNECT
   ========================================================= */

.datmit-connect-intro {
    padding: 130px 32px 140px;
}

.datmit-connect-intro h2,
.datmit-connect-network h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-connect-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-connect-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-connect-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-connect-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-connect-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-connect-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-connect-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-connect-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-connect-network {
    padding: 130px 32px;
}

.datmit-connect-operator {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

@media (max-width: 700px) {

    .datmit-connect-intro,
    .datmit-connect-services,
    .datmit-connect-network,
    .datmit-connect-operator {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-connect-grid {
        grid-template-columns: 1fr;
    }

    .datmit-connect-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   CREATIVE
   ========================================================= */

.datmit-creative-intro {
    padding: 130px 32px 140px;
}

.datmit-creative-intro h2,
.datmit-creative-portfolio h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-creative-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-creative-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-creative-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-creative-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-creative-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-creative-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-creative-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-creative-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-creative-portfolio {
    padding: 130px 32px;
}

@media (max-width: 700px) {

    .datmit-creative-intro,
    .datmit-creative-services,
    .datmit-creative-portfolio {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-creative-grid {
        grid-template-columns: 1fr;
    }

    .datmit-creative-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   STORE
   ========================================================= */

.datmit-store-intro {
    padding: 130px 32px 140px;
}

.datmit-store-intro h2,
.datmit-store-project h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-store-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-store-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-store-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-store-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-store-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-store-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-store-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-store-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-store-project {
    padding: 130px 32px;
}

@media (max-width: 700px) {

    .datmit-store-intro,
    .datmit-store-services,
    .datmit-store-project {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-store-grid {
        grid-template-columns: 1fr;
    }

    .datmit-store-grid article:nth-child(odd) {
        border-right: 0;
    }

}

/* =========================================================
   AI
   ========================================================= */

.datmit-ai-intro {
    padding: 130px 32px 140px;
}

.datmit-ai-intro h2,
.datmit-ai-method h2 {
    margin: 0 0 40px;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 1;
    letter-spacing: -.05em;
    font-weight: 500;
}

.datmit-ai-lead {
    max-width: 800px;
    margin: 0;
    font-size: 21px;
    line-height: 1.65;
    color: var(--datmit-muted);
}

.datmit-ai-services {
    padding: 120px 32px 150px;
    background: #f4f6f7;
}

.datmit-ai-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    margin-top: 55px;
    border-top: 1px solid #ccd3d8;
}

.datmit-ai-grid article {
    padding: 44px 40px 52px;
    border-bottom: 1px solid #ccd3d8;
}

.datmit-ai-grid article:nth-child(odd) {
    border-right: 1px solid #ccd3d8;
}

.datmit-ai-grid span {
    display: block;
    margin-bottom: 55px;
    font-size: 12px;
    color: var(--datmit-muted);
}

.datmit-ai-grid h3 {
    margin: 0 0 18px;
    font-size: clamp(30px, 3vw, 48px);
    line-height: 1;
    letter-spacing: -.04em;
    font-weight: 500;
}

.datmit-ai-grid p {
    max-width: 600px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--datmit-muted);
}

.datmit-ai-method {
    padding: 130px 32px;
}

.datmit-ai-principles {
    padding: 120px 32px;
    background: var(--datmit-dark);
    color: #fff;
}

@media (max-width: 700px) {

    .datmit-ai-intro,
    .datmit-ai-services,
    .datmit-ai-method,
    .datmit-ai-principles {
        padding-left: 20px;
        padding-right: 20px;
    }

    .datmit-ai-grid {
        grid-template-columns: 1fr;
    }

    .datmit-ai-grid article:nth-child(odd) {
        border-right: 0;
    }

}

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

.datmit-header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.datmit-menu-toggle {
    display: none;
    width: 46px;
    height: 46px;
    border: 1px solid var(--datmit-line);
    border-radius: 50%;
    background: transparent;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    cursor: pointer;
}

.datmit-menu-toggle span {
    display: block;
    width: 18px;
    height: 1px;
    background: var(--datmit-text);
    transition: transform .2s ease;
}

.datmit-mobile-menu {
    display: none;
    border-top: 1px solid var(--datmit-line);
    background: #fff;
}

.datmit-mobile-menu nav {
    max-width: var(--datmit-max);
    margin: 0 auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

.datmit-mobile-menu a {
    padding: 15px 0;
    border-bottom: 1px solid var(--datmit-line);
    text-decoration: none;
    font-size: 20px;
}

.datmit-mobile-menu.is-open {
    display: block;
}

@media (max-width: 900px) {

    .datmit-nav {
        display: none;
    }

    .datmit-menu-toggle {
        display: flex;
    }

    .datmit-support {
        display: none;
    }

}

/* =========================================================
   DATMIT LOGO
   ========================================================= */

.datmit-brand-logo {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.datmit-brand-logo img {
    display: block;
    width: 180px;
    height: auto;
}

@media (max-width: 600px) {

    .datmit-brand-logo img {
        width: 150px;
    }

}

.datmit-footer-logo-image {
    display: block;
    width: 190px;
    height: auto;
    filter: brightness(0) invert(1);
}

.datmit-footer-contact {
    margin-top: 34px;
}

.datmit-footer-contact p {
    margin: 0 0 16px;
    color: rgba(255,255,255,.55);
    font-size: 15px;
    line-height: 1.6;
}

.datmit-footer-contact a {
    color: inherit;
    text-decoration: none;
}

.datmit-footer-contact a:hover {
    color: #fff;
}

/* =========================================================
   ACTIVE NAVIGATION
   ========================================================= */

.datmit-nav a {
    position: relative;
}

.datmit-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -8px;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .25s ease;
}

.datmit-nav a:hover::after,
.datmit-nav a.is-current::after {
    transform: scaleX(1);
}

.datmit-nav a.is-current {
    opacity: 1;
}

.datmit-mobile-menu a.is-current {
    font-weight: 600;
}

/* =========================================================
   LIGHT REVEAL ANIMATIONS
   ========================================================= */

.datmit-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity .65s ease,
        transform .65s ease;
    will-change: opacity, transform;
}

.datmit-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

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

    .datmit-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

}


/* =========================================================
   DATMIT REDESIGN 2026
   HEADER + HERO TECHNOLOGY
   ========================================================= */

:root {
    --datmit-bg-dark: #020b14;
    --datmit-bg-dark-2: #071424;
    --datmit-accent: #199dff;
    --datmit-accent-light: #68c8ff;

    --datmit-text-light: #f7f9fc;
    --datmit-text-muted: #9cabbc;

    --datmit-border-dark: rgba(255,255,255,.10);
    --datmit-border-light: rgba(8,22,40,.10);
}


/* =========================================================
   HEADER BASE
   ========================================================= */

.datmit-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;

    background: rgba(255,255,255,.97);

    border-bottom:
        1px solid var(--datmit-border-light);

    transition:
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}


.datmit-header-inner {

    width: 100%;
    max-width: 1440px;

    min-height: 92px;

    margin: 0 auto;
    padding: 0 38px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 34px;
}


/* =========================================================
   LOGO
   ========================================================= */

.datmit-brand {

    position: relative;

    display: inline-flex;
    align-items: center;

    flex: 0 0 auto;

    text-decoration: none;
}


.datmit-logo-image {

    display: block;

    width: auto;
    height: 58px;

    object-fit: contain;
}


/* pagine chiare */

.datmit-logo-light {
    display: none;
}

.datmit-logo-dark {
    display: block;
}


/* homepage scura */

body.home .datmit-logo-light {
    display: block;
}

body.home .datmit-logo-dark {
    display: none;
}


/* =========================================================
   HOME HEADER SOPRA HERO
   ========================================================= */

body.home .datmit-header {

    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    background:
        linear-gradient(
            180deg,
            rgba(2,11,20,.92) 0%,
            rgba(2,11,20,.70) 65%,
            rgba(2,11,20,.20) 100%
        );

    border-bottom:
        1px solid rgba(255,255,255,.08);

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}


/* =========================================================
   DESKTOP NAVIGATION
   ========================================================= */

.datmit-nav {

    display: flex;

    flex: 1 1 auto;

    align-items: center;
    justify-content: center;

    gap: 31px;
}


.datmit-nav a {

    position: relative;

    color: #101820;

    text-decoration: none;

    font-size: 15px;
    line-height: 1;

    font-weight: 500;

    white-space: nowrap;

    transition:
        color .2s ease,
        opacity .2s ease;
}


body.home .datmit-nav a {

    color: rgba(255,255,255,.88);
}


.datmit-nav a:hover,
.datmit-nav a.is-current,
.datmit-nav a[aria-current="page"] {

    color: var(--datmit-accent);
}


.datmit-nav a::after {

    content: "";

    position: absolute;

    left: 0;
    right: 0;

    bottom: -11px;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--datmit-accent),
            var(--datmit-accent-light)
        );

    transform: scaleX(0);

    transform-origin: center;

    transition:
        transform .22s ease;
}


.datmit-nav a:hover::after,
.datmit-nav a.is-current::after,
.datmit-nav a[aria-current="page"]::after {

    transform: scaleX(1);
}


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

.datmit-header-actions {

    display: flex;

    align-items: center;

    gap: 16px;

    flex-shrink: 0;
}


.datmit-client-area {

    min-height: 46px;

    padding: 0 19px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    border-radius: 999px;

    border:
        1px solid rgba(25,157,255,.65);

    color: #0b1621;

    text-decoration: none;

    font-size: 14px;

    font-weight: 500;

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


body.home .datmit-client-area {

    color: #ffffff;

    background:
        rgba(5,18,31,.48);

    border-color:
        rgba(25,157,255,.75);
}


.datmit-client-area:hover {

    transform: translateY(-1px);

    border-color:
        var(--datmit-accent);

    box-shadow:
        0 0 22px rgba(25,157,255,.16);
}


.datmit-client-icon {

    color: var(--datmit-accent);

    font-size: 18px;
}


/* =========================================================
   MOBILE BUTTON
   ========================================================= */

.datmit-menu-toggle {

    width: 46px;
    height: 46px;

    display: none;

    align-items: center;
    justify-content: center;

    flex-direction: column;

    gap: 6px;

    padding: 0;

    border-radius: 12px;

    border:
        1px solid rgba(8,22,40,.14);

    background:
        rgba(255,255,255,.55);

    cursor: pointer;
}


body.home .datmit-menu-toggle {

    background:
        rgba(255,255,255,.04);

    border-color:
        rgba(255,255,255,.15);
}


.datmit-menu-toggle span {

    width: 20px;
    height: 2px;

    display: block;

    border-radius: 2px;

    background: #111820;
}


body.home .datmit-menu-toggle span {

    background: #ffffff;
}


/* =========================================================
   MOBILE MENU
   ========================================================= */

.datmit-mobile-menu {

    display: none;

    padding:
        12px 30px 30px;

    background:
        linear-gradient(
            180deg,
            #071525 0%,
            #020a12 100%
        );

    border-top:
        1px solid rgba(255,255,255,.08);
}


.datmit-mobile-menu.is-open {
    display: block;
}


.datmit-mobile-menu nav {

    display: grid;

    gap: 0;
}


.datmit-mobile-menu a {

    padding: 13px 0;

    color: rgba(255,255,255,.88);

    text-decoration: none;

    font-size: 16px;

    border-bottom:
        1px solid rgba(255,255,255,.06);
}


.datmit-mobile-menu a.is-current {

    color: var(--datmit-accent);
}


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

body.home .datmit-hero {

    position: relative;

    overflow: hidden;

    min-height: 820px;

    padding:
        185px 0 115px;

    color: #ffffff;

    background:

        radial-gradient(
            circle at 77% 43%,
            rgba(21,157,255,.22) 0%,
            rgba(21,157,255,.09) 21%,
            transparent 48%
        ),

        linear-gradient(
            135deg,
            #020a12 0%,
            #04101c 45%,
            #061928 100%
        );
}


/* griglia tecnologica */

body.home .datmit-hero::before {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    background:

        linear-gradient(
            rgba(96,180,230,.055) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(96,180,230,.055) 1px,
            transparent 1px
        );

    background-size:
        105px 105px;

    opacity: .75;
}


/* bagliore */

body.home .datmit-hero::after {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    background:

        radial-gradient(
            circle at 82% 48%,
            rgba(44,184,255,.18) 0%,
            rgba(12,81,130,.12) 23%,
            transparent 48%
        ),

        radial-gradient(
            ellipse at 70% 100%,
            rgba(0,103,190,.12) 0%,
            transparent 52%
        );
}


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

body.home .datmit-hero-inner {

    position: relative;

    z-index: 4;

    width: 100%;
    max-width: 1440px;

    margin: 0 auto;

    padding:
        0 40px;
}


body.home .datmit-hero-copy {

    width: min(100%, 780px);
}


body.home .datmit-hero-label,
body.home .datmit-section-label {

    color:
        rgba(255,255,255,.60);

    text-transform:
        uppercase;

    letter-spacing:
        .20em;

    font-size:
        13px;

    font-weight:
        600;
}


body.home .datmit-hero h1,
body.home .datmit-hero-title {

    max-width: 780px;

    margin:
        26px 0 28px;

    color: #ffffff;

    font-size:
        clamp(64px, 6.2vw, 102px);

    line-height:
        .96;

    font-weight:
        650;

    letter-spacing:
        -.055em;
}


body.home .datmit-hero-title .accent,
body.home .datmit-accent-line {

    color:
        var(--datmit-accent);
}


body.home .datmit-hero-text {

    max-width:
        720px;

    color:
        rgba(225,234,242,.80);

    font-size:
        20px;

    line-height:
        1.65;
}


/* =========================================================
   TECHNOLOGY VISUAL
   ========================================================= */

.datmit-hero-visual {

    position: absolute;

    z-index: 2;

    width:
        min(43vw, 670px);

    aspect-ratio:
        1 / 1;

    right:
        4%;

    top:
        145px;

    border-radius:
        50%;

    pointer-events:
        none;

    border:
        1px solid rgba(103,190,240,.12);
}


.datmit-hero-visual::before {

    content: "";

    position: absolute;

    inset: 15%;

    border-radius:
        50%;

    border:
        1px solid rgba(103,190,240,.17);
}


.datmit-hero-visual::after {

    content: "";

    position: absolute;

    inset: 31%;

    border-radius:
        50%;

    border:
        1px solid rgba(103,190,240,.20);

    box-shadow:
        0 0 80px rgba(25,157,255,.08);
}


/* =========================================================
   LIGHT SIGNALS
   ========================================================= */

.datmit-hero-network {

    position: absolute;

    z-index: 3;

    inset: 0;

    overflow: hidden;

    pointer-events: none;
}


.datmit-hero-network::before,
.datmit-hero-network::after {

    content: "";

    position: absolute;

    display: block;

    border-radius: 50%;

    background:
        #1bb2ff;

    box-shadow:

        0 0 6px rgba(27,178,255,1),

        0 0 18px rgba(27,178,255,.85),

        0 0 36px rgba(27,178,255,.45);
}


.datmit-hero-network::before {

    width:
        10px;

    height:
        10px;

    left:
        66%;

    top:
        32%;

    animation:
        datmitSignalOne 7s ease-in-out infinite;
}


.datmit-hero-network::after {

    width:
        8px;

    height:
        8px;

    left:
        83%;

    top:
        58%;

    animation:
        datmitSignalTwo 9s ease-in-out infinite;
}


@keyframes datmitSignalOne {

    0% {
        transform:
            translate(0,0);

        opacity:
            .25;
    }

    25% {
        transform:
            translate(90px,-45px);

        opacity:
            1;
    }

    50% {
        transform:
            translate(155px,15px);

        opacity:
            .55;
    }

    75% {
        transform:
            translate(60px,95px);

        opacity:
            1;
    }

    100% {
        transform:
            translate(0,0);

        opacity:
            .25;
    }
}


@keyframes datmitSignalTwo {

    0% {
        transform:
            translate(0,0);

        opacity:
            .30;
    }

    30% {
        transform:
            translate(-115px,-65px);

        opacity:
            1;
    }

    60% {
        transform:
            translate(-165px,45px);

        opacity:
            .55;
    }

    85% {
        transform:
            translate(-55px,110px);

        opacity:
            1;
    }

    100% {
        transform:
            translate(0,0);

        opacity:
            .30;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

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

    .datmit-hero-network::before,
    .datmit-hero-network::after {

        animation:
            none;
    }
}


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

@media (max-width: 1180px) {

    .datmit-header-inner {

        padding:
            0 26px;
    }


    .datmit-nav {

        gap:
            20px;
    }


    .datmit-nav a {

        font-size:
            14px;
    }


    body.home .datmit-hero {

        min-height:
            760px;
    }

}


@media (max-width: 980px) {

    .datmit-nav {

        display:
            none;
    }


    .datmit-client-area {

        display:
            none;
    }


    .datmit-menu-toggle {

        display:
            inline-flex;
    }


    .datmit-header-inner {

        min-height:
            82px;
    }


    .datmit-logo-image {

        height:
            48px;
    }


    body.home .datmit-hero {

        min-height:
            auto;

        padding:
            145px 0 85px;
    }


    body.home .datmit-hero-inner {

        padding:
            0 26px;
    }


    body.home .datmit-hero h1,
    body.home .datmit-hero-title {

        font-size:
            clamp(48px, 10vw, 76px);
    }


    .datmit-hero-visual {

        opacity:
            .5;

        right:
            -160px;

        top:
            190px;

        width:
            620px;
    }

}


@media (max-width: 640px) {

    .datmit-header-inner {

        padding:
            0 18px;
    }


    .datmit-logo-image {

        height:
            42px;
    }


    .datmit-mobile-menu {

        padding-left:
            18px;

        padding-right:
            18px;
    }


    body.home .datmit-hero-inner {

        padding:
            0 20px;
    }


    body.home .datmit-hero {

        padding-top:
            125px;
    }


    body.home .datmit-hero h1,
    body.home .datmit-hero-title {

        font-size:
            clamp(43px, 13vw, 62px);
    }


    body.home .datmit-hero-text {

        font-size:
            17px;
    }


    .datmit-hero-visual {

        right:
            -275px;

        width:
            560px;

        opacity:
            .35;
    }

}



/* =========================================================
   DATMIT HERO - FIBER / CIRCUIT EFFECTS
   ========================================================= */

body.home .datmit-hero-copy {
    position: relative;
    z-index: 6;
}

body.home .datmit-eyebrow {
    margin: 0 0 20px;
    color: rgba(196, 215, 230, .72);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .19em;
    line-height: 1.6;
}


/* ---------------------------------------------------------
   ORBITS
   --------------------------------------------------------- */

body.home .datmit-orbit {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(90, 185, 240, .16);
}

body.home .datmit-orbit-1 {
    inset: 4%;
}

body.home .datmit-orbit-2 {
    inset: 20%;
}

body.home .datmit-orbit-3 {
    inset: 36%;
}


/* ---------------------------------------------------------
   CORE
   --------------------------------------------------------- */

body.home .datmit-core {
    position: absolute;

    left: 50%;
    top: 50%;

    width: 104px;
    height: 104px;

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

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,1) 0%,
            rgba(228,247,255,.98) 37%,
            rgba(60,190,255,.68) 42%,
            rgba(25,157,255,.15) 62%,
            transparent 72%
        );

    box-shadow:
        0 0 28px rgba(32,180,255,.70),
        0 0 80px rgba(25,157,255,.34);
}

body.home .datmit-core span {
    position: absolute;
    inset: 42%;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 0 18px #ffffff;
}


/* ---------------------------------------------------------
   NETWORK NODES
   --------------------------------------------------------- */

body.home .datmit-node {
    position: absolute;

    width: 10px;
    height: 10px;

    border-radius: 50%;

    background: #20b8ff;

    box-shadow:
        0 0 8px rgba(32,184,255,1),
        0 0 22px rgba(32,184,255,.65);
}

body.home .datmit-node-1 {
    left: 4%;
    top: 47%;
}

body.home .datmit-node-2 {
    right: 9%;
    top: 26%;
}

body.home .datmit-node-3 {
    right: 2%;
    bottom: 23%;
}

body.home .datmit-node-4 {
    left: 28%;
    bottom: 4%;
}

body.home .datmit-node-5 {
    left: 20%;
    top: 16%;
}


/* ---------------------------------------------------------
   CIRCUIT LINES
   --------------------------------------------------------- */

body.home .datmit-circuit {
    position: absolute;

    height: 1px;

    transform-origin: left center;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(33,177,255,.08) 8%,
            rgba(33,177,255,.55) 48%,
            rgba(33,177,255,.08) 92%,
            transparent 100%
        );

    box-shadow:
        0 0 8px rgba(33,177,255,.12);
}

body.home .datmit-circuit::after {
    content: "";

    position: absolute;

    right: 0;
    top: 50%;

    width: 5px;
    height: 5px;

    transform: translateY(-50%);

    border-radius: 50%;

    background: #3fc4ff;

    box-shadow:
        0 0 10px rgba(63,196,255,.85);
}

body.home .datmit-circuit-1 {
    width: 42%;
    left: 7%;
    top: 49%;
    transform: rotate(-18deg);
}

body.home .datmit-circuit-2 {
    width: 39%;
    left: 50%;
    top: 50%;
    transform: rotate(31deg);
}

body.home .datmit-circuit-3 {
    width: 32%;
    left: 28%;
    top: 78%;
    transform: rotate(-58deg);
}


/* ---------------------------------------------------------
   FIBER LINES
   --------------------------------------------------------- */

body.home .datmit-fiber {
    position: absolute;

    z-index: 1;

    display: block;

    width: 40vw;
    max-width: 720px;

    height: 1px;

    opacity: .56;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(24,164,255,.10),
            rgba(79,204,255,.55),
            rgba(24,164,255,.16),
            transparent
        );

    filter:
        drop-shadow(0 0 5px rgba(35,178,255,.28));

    transform-origin:
        center;
}

body.home .datmit-fiber::after {
    content: "";

    position: absolute;

    top: 50%;

    width: 8px;
    height: 8px;

    border-radius: 50%;

    transform: translateY(-50%);

    background: #7bd7ff;

    box-shadow:
        0 0 8px rgba(123,215,255,1),
        0 0 22px rgba(32,178,255,.85);

    animation:
        datmitFiberPulse 5.5s linear infinite;
}

body.home .datmit-fiber-1 {
    right: -7%;
    top: 31%;
    transform: rotate(-12deg);
}

body.home .datmit-fiber-2 {
    right: -3%;
    top: 61%;
    transform: rotate(9deg);
}

body.home .datmit-fiber-3 {
    right: 14%;
    top: 82%;
    width: 32vw;
    transform: rotate(-28deg);
}

body.home .datmit-fiber-2::after {
    animation-delay: -1.8s;
}

body.home .datmit-fiber-3::after {
    animation-delay: -3.4s;
}

@keyframes datmitFiberPulse {

    0% {
        left: 0%;
        opacity: 0;
    }

    8% {
        opacity: 1;
    }

    88% {
        opacity: 1;
    }

    100% {
        left: 100%;
        opacity: 0;
    }

}


/* ---------------------------------------------------------
   EXTRA SIGNALS
   --------------------------------------------------------- */

body.home .datmit-signal {
    position: absolute;

    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #37c0ff;

    box-shadow:
        0 0 9px rgba(55,192,255,1),
        0 0 24px rgba(55,192,255,.65);

    z-index: 3;
}

body.home .datmit-signal-1 {
    left: 61%;
    top: 29%;
    animation: datmitSignalFloat1 8s ease-in-out infinite;
}

body.home .datmit-signal-2 {
    left: 86%;
    top: 41%;
    animation: datmitSignalFloat2 10s ease-in-out infinite;
}

body.home .datmit-signal-3 {
    left: 73%;
    top: 73%;
    animation: datmitSignalFloat3 9s ease-in-out infinite;
}

body.home .datmit-signal-4 {
    left: 91%;
    top: 69%;
    animation: datmitSignalFloat4 12s ease-in-out infinite;
}

@keyframes datmitSignalFloat1 {
    0%,100% { transform: translate(0,0); opacity: .35; }
    50%     { transform: translate(70px,-35px); opacity: 1; }
}

@keyframes datmitSignalFloat2 {
    0%,100% { transform: translate(0,0); opacity: .30; }
    50%     { transform: translate(-90px,55px); opacity: 1; }
}

@keyframes datmitSignalFloat3 {
    0%,100% { transform: translate(0,0); opacity: .35; }
    50%     { transform: translate(55px,-65px); opacity: 1; }
}

@keyframes datmitSignalFloat4 {
    0%,100% { transform: translate(0,0); opacity: .25; }
    50%     { transform: translate(-75px,-40px); opacity: 1; }
}


/* ---------------------------------------------------------
   HERO BUTTONS
   --------------------------------------------------------- */

body.home .datmit-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 34px;
}

body.home .datmit-button-primary,
body.home .datmit-button-secondary {
    min-height: 52px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 24px;

    border-radius: 999px;

    font-size: 15px;
    font-weight: 600;

    text-decoration: none;

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

body.home .datmit-button-primary {
    color: #ffffff;

    border: 1px solid #199dff;

    background:
        linear-gradient(
            135deg,
            #199dff,
            #0878e7
        );

    box-shadow:
        0 10px 30px rgba(15,126,232,.24);
}

body.home .datmit-button-primary:hover {
    transform: translateY(-2px);

    box-shadow:
        0 14px 38px rgba(15,126,232,.38);
}

body.home .datmit-button-secondary {
    color: rgba(255,255,255,.92);

    border:
        1px solid rgba(255,255,255,.22);

    background:
        rgba(255,255,255,.025);
}

body.home .datmit-button-secondary:hover {
    transform: translateY(-2px);

    border-color:
        rgba(74,190,255,.60);

    background:
        rgba(32,161,235,.07);
}


/* ---------------------------------------------------------
   MOBILE HERO CLEANUP
   --------------------------------------------------------- */

@media (max-width: 980px) {

    body.home .datmit-hero-copy {
        max-width: 680px;
    }

    body.home .datmit-circuit {
        opacity: .55;
    }

    body.home .datmit-fiber {
        opacity: .35;
    }

}

@media (max-width: 640px) {

    body.home .datmit-eyebrow {
        max-width: 90%;
        font-size: 10px;
        letter-spacing: .14em;
    }

    body.home .datmit-hero-title br {
        display: none;
    }

    body.home .datmit-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    body.home .datmit-button-primary,
    body.home .datmit-button-secondary {
        width: 100%;
    }

    body.home .datmit-fiber,
    body.home .datmit-circuit {
        opacity: .22;
    }

}

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

    body.home .datmit-fiber::after,
    body.home .datmit-signal {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT HERO / HEADER TUNING
   2026-09
   ========================================================= */


/* Header un po' più compatto */

body.home .datmit-header-inner {
    max-width: 1540px;
    min-height: 86px;
    padding-left: 30px;
    padding-right: 30px;
    gap: 24px;
}


/* Logo */

body.home .datmit-logo-image {
    height: 54px;
}


/* Navigazione leggermente più compatta */

body.home .datmit-nav {
    gap: 27px;
}

body.home .datmit-nav a {
    font-size: 14px;
}


/* Remote Support: evita il taglio sul bordo destro */

body.home .datmit-client-area {
    min-height: 44px;
    padding-left: 17px;
    padding-right: 17px;
    font-size: 13px;
    white-space: nowrap;
}


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

body.home .datmit-hero {
    min-height: 720px;

    padding-top: 140px;
    padding-bottom: 80px;
}


/* Contenuto leggermente più in alto */

body.home .datmit-hero-inner {
    max-width: 1540px;

    padding-left: 50px;
    padding-right: 50px;
}


/* Testo */

body.home .datmit-hero-copy {
    width: min(100%, 800px);
}


/* Eyebrow */

body.home .datmit-eyebrow {
    margin-bottom: 16px;

    max-width: 760px;

    font-size: 11px;
    line-height: 1.55;

    letter-spacing: .18em;
}


/* Titolo più equilibrato */

body.home .datmit-hero h1,
body.home .datmit-hero-title {

    max-width: 820px;

    margin-top: 18px;
    margin-bottom: 24px;

    font-size: clamp(58px, 5.1vw, 84px);

    line-height: .98;

    letter-spacing: -.05em;
}


/* Testo descrittivo */

body.home .datmit-hero-text {
    max-width: 690px;

    font-size: 18px;
    line-height: 1.6;
}


/* =========================================================
   HERO TECHNOLOGY VISUAL
   ========================================================= */

/*
 * Spostiamo il visual più a destra:
 * deve accompagnare il testo, non competere con esso.
 */

body.home .datmit-hero-visual {

    width: min(44vw, 700px);

    right: -1%;

    top: 155px;

    opacity: .88;
}


/* Orbite un po' più leggere */

body.home .datmit-orbit {
    border-color: rgba(85, 183, 240, .12);
}


/* Core meno dominante */

body.home .datmit-core {

    width: 88px;
    height: 88px;

    box-shadow:
        0 0 26px rgba(32,180,255,.55),
        0 0 72px rgba(25,157,255,.25);
}


/* Griglia più discreta */

body.home .datmit-hero::before {

    background-size:
        110px 110px;

    opacity:
        .52;
}


/* Circuiti più sottili */

body.home .datmit-circuit {
    opacity: .70;
}


/* Fibre */

body.home .datmit-fiber {
    opacity: .48;
}


/* =========================================================
   DESKTOP MEDIO
   ========================================================= */

@media (max-width: 1400px) {

    body.home .datmit-header-inner {
        padding-left: 24px;
        padding-right: 24px;
    }

    body.home .datmit-nav {
        gap: 20px;
    }

    body.home .datmit-hero-inner {
        padding-left: 38px;
        padding-right: 38px;
    }

    body.home .datmit-hero h1,
    body.home .datmit-hero-title {
        font-size: clamp(56px, 5vw, 78px);
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {

    body.home .datmit-hero {
        padding-top: 125px;
        padding-bottom: 70px;
    }

    body.home .datmit-hero-inner {
        padding-left: 24px;
        padding-right: 24px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

    body.home .datmit-hero {
        padding-top: 112px;
        padding-bottom: 58px;
    }

    body.home .datmit-hero h1,
    body.home .datmit-hero-title {
        font-size: clamp(42px, 12vw, 58px);
        line-height: 1;
    }

}



/* =========================================================
   DATMIT FINAL HERO ALIGNMENT
   ========================================================= */

body.home .datmit-header-inner {
    box-sizing: border-box;
    width: calc(100% - 40px);
    max-width: 1540px;
    padding-left: 18px;
    padding-right: 18px;
}

body.home .datmit-hero-inner {
    box-sizing: border-box;
}

body.home .datmit-hero::before {
    opacity: .42;
}

body.home .datmit-client-area {
    flex-shrink: 0;
}

@media (max-width: 1400px) {

    body.home .datmit-header-inner {
        width: calc(100% - 28px);
    }

}



/* =========================================================
   DATMIT HOME DIVISIONS 2026
   ========================================================= */

body.home .datmit-divisions-home {
    position: relative;
    overflow: hidden;
    padding: 82px 0 92px;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(20,117,190,.13),
            transparent 38%
        ),
        #030b13;
    color: #fff;
}

body.home .datmit-divisions-inner {
    width: calc(100% - 70px);
    max-width: 1540px;
    margin: 0 auto;
}

body.home .datmit-divisions-heading {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 60px;
    align-items: end;
    margin-bottom: 44px;
}

body.home .datmit-divisions-heading .datmit-section-label {
    margin: 0 0 15px;
    color: #66c9ff;
}

body.home .datmit-divisions-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(42px, 4vw, 66px);
    line-height: 1;
    letter-spacing: -.045em;
}

body.home .datmit-divisions-heading h2 span {
    color: #199dff;
}

body.home .datmit-divisions-heading > p {
    max-width: 600px;
    margin: 0 0 5px;
    color: rgba(220,231,240,.67);
    font-size: 17px;
    line-height: 1.65;
}


/* ---------------------------------------------------------
   GRID
   --------------------------------------------------------- */

body.home .datmit-home-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}


/* ---------------------------------------------------------
   CARD
   --------------------------------------------------------- */

body.home .datmit-home-card {
    position: relative;
    min-width: 0;
    min-height: 390px;
    overflow: hidden;

    display: flex;
    flex-direction: column;

    color: #fff;
    text-decoration: none;

    border: 1px solid rgba(255,255,255,.11);
    border-radius: 12px;

    background:
        linear-gradient(
            180deg,
            rgba(11,27,42,.97),
            rgba(4,13,22,.98)
        );

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

body.home .datmit-home-card:hover {
    transform: translateY(-5px);

    border-color:
        rgba(60,190,255,.45);

    box-shadow:
        0 18px 45px rgba(0,0,0,.32),
        0 0 35px rgba(25,157,255,.08);
}


/* ---------------------------------------------------------
   VISUAL
   --------------------------------------------------------- */

body.home .datmit-card-visual {
    position: relative;
    height: 170px;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 70% 40%,
            rgba(34,174,255,.30),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #06111c,
            #08253c
        );
}

body.home .datmit-card-visual::before {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            rgba(120,200,245,.06) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(120,200,245,.06) 1px,
            transparent 1px
        );

    background-size: 35px 35px;
}

body.home .datmit-card-visual::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -55px;
    bottom: -90px;

    border-radius: 50%;

    border:
        1px solid rgba(75,190,255,.28);

    box-shadow:
        0 0 50px rgba(25,157,255,.13);
}


/* numerazione */

body.home .datmit-card-code {
    position: absolute;
    z-index: 2;

    left: 18px;
    top: 16px;

    font-size: 11px;
    letter-spacing: .15em;

    color: rgba(255,255,255,.46);
}


/* simbolo */

body.home .datmit-card-symbol {
    position: absolute;
    z-index: 2;

    left: 20px;
    bottom: 14px;

    font-size: 38px;
    line-height: 1;

    color: #39baff;

    text-shadow:
        0 0 22px rgba(57,186,255,.34);
}


/* ---------------------------------------------------------
   CONTENT
   --------------------------------------------------------- */

body.home .datmit-card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 23px 20px 20px;
}

body.home .datmit-card-content h3 {
    margin: 0 0 13px;
    color: #fff;
    font-size: 19px;
    font-weight: 550;
    letter-spacing: -.02em;
}

body.home .datmit-card-content h3 strong {
    color: #43bdff;
    font-weight: 650;
}

body.home .datmit-card-content p {
    margin: 0;
    color: rgba(220,231,240,.66);
    font-size: 14px;
    line-height: 1.55;
}

body.home .datmit-card-link {
    margin-top: auto;
    padding-top: 22px;

    color: #fff;

    font-size: 13px;
    font-weight: 550;
}


/* ---------------------------------------------------------
   INDIVIDUAL ACCENTS
   --------------------------------------------------------- */

body.home .datmit-card-security .datmit-card-symbol,
body.home .datmit-card-security h3 strong {
    color: #53e0c0;
}

body.home .datmit-card-security:hover {
    border-color: rgba(83,224,192,.45);
}

body.home .datmit-card-systems .datmit-card-symbol,
body.home .datmit-card-systems h3 strong {
    color: #ff9a43;
}

body.home .datmit-card-systems:hover {
    border-color: rgba(255,154,67,.45);
}

body.home .datmit-card-creative .datmit-card-symbol,
body.home .datmit-card-creative h3 strong {
    color: #bd78ff;
}

body.home .datmit-card-creative:hover {
    border-color: rgba(189,120,255,.46);
}

body.home .datmit-card-store .datmit-card-symbol,
body.home .datmit-card-store h3 strong {
    color: #ec6cff;
}

body.home .datmit-card-store:hover {
    border-color: rgba(236,108,255,.44);
}

body.home .datmit-card-ai .datmit-card-symbol,
body.home .datmit-card-ai h3 strong {
    color: #74a8ff;
}


/*
 * La settima card viene centrata visivamente
 * nell'ultima riga su desktop.
 */

body.home .datmit-card-ai {
    grid-column: 2 / span 2;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1180px) {

    body.home .datmit-home-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    body.home .datmit-card-ai {
        grid-column: auto;
    }

}

@media (max-width: 760px) {

    body.home .datmit-divisions-home {
        padding: 64px 0 70px;
    }

    body.home .datmit-divisions-inner {
        width: calc(100% - 36px);
    }

    body.home .datmit-divisions-heading {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    body.home .datmit-home-cards {
        grid-template-columns: 1fr;
    }

    body.home .datmit-home-card {
        min-height: 350px;
    }

}



/* =========================================================
   DATMIT DIVISION GRID REFINEMENT
   ========================================================= */

body.home .datmit-home-cards {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 12px;
}

body.home .datmit-home-card {
    grid-column: span 3;
}

body.home .datmit-card-creative,
body.home .datmit-card-store,
body.home .datmit-card-ai {
    grid-column: span 4;
}

body.home .datmit-card-ai {
    grid-column: span 4;
}

@media (max-width: 1180px) {

    body.home .datmit-home-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.home .datmit-home-card,
    body.home .datmit-card-creative,
    body.home .datmit-card-store,
    body.home .datmit-card-ai {
        grid-column: auto;
    }

}

@media (max-width: 760px) {

    body.home .datmit-home-cards {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   DATMIT CERTIFICATIONS / CREDENTIALS STRIP
   ========================================================= */

body.home .datmit-credentials {

    position: relative;

    background:
        linear-gradient(
            180deg,
            #071524 0%,
            #05101c 100%
        );

    border-top:
        1px solid rgba(255,255,255,.08);

    border-bottom:
        1px solid rgba(255,255,255,.08);
}


body.home .datmit-credentials-inner {

    width: calc(100% - 70px);

    max-width: 1540px;

    min-height: 118px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        repeat(7, minmax(0, 1fr));

    align-items: stretch;
}


body.home .datmit-credential {

    min-width: 0;

    display: flex;

    align-items: center;

    gap: 13px;

    padding:
        22px 18px;

    border-right:
        1px solid rgba(255,255,255,.09);
}


body.home .datmit-credential:first-child {

    border-left:
        1px solid rgba(255,255,255,.09);
}


body.home .datmit-credential-icon {

    flex: 0 0 auto;

    width: 36px;
    height: 36px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    color:
        #59c7ff;

    font-size:
        25px;

    line-height:
        1;

    text-shadow:
        0 0 18px rgba(66,193,255,.24);
}


body.home .datmit-credential div {

    min-width: 0;
}


body.home .datmit-credential strong {

    display: block;

    margin-bottom:
        5px;

    color:
        #ffffff;

    font-size:
        13px;

    font-weight:
        650;

    line-height:
        1.25;
}


body.home .datmit-credential small {

    display: block;

    color:
        rgba(199,215,228,.56);

    font-size:
        10px;

    line-height:
        1.35;
}


/* hover molto leggero */

body.home .datmit-credential {

    transition:
        background .2s ease;
}


body.home .datmit-credential:hover {

    background:
        rgba(27,158,230,.045);
}


/* ---------------------------------------------------------
   CERTIFICATIONS RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1180px) {

    body.home .datmit-credentials-inner {

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


    body.home .datmit-credential {

        border-bottom:
            1px solid rgba(255,255,255,.08);
    }

}


@media (max-width: 760px) {

    body.home .datmit-credentials-inner {

        width:
            calc(100% - 36px);

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


    body.home .datmit-credential {

        padding:
            19px 12px;
    }


    body.home .datmit-credential-icon {

        width:
            30px;

        height:
            30px;

        font-size:
            21px;
    }

}



/* =========================================================
   DATMIT HERO REFINEMENT 2026
   Hero più compatta + fibre full width + segnali colorati
   ========================================================= */

/* HERO generale */
body.home .datmit-hero {
    position: relative;
    overflow: hidden;
    padding: 0;
    min-height: 920px;
    background:
        linear-gradient(90deg, rgba(2,10,20,.96) 0%, rgba(3,13,24,.96) 36%, rgba(7,41,74,.95) 100%);
}

/* griglia / luce generale estesa su tutta la hero */
body.home .datmit-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        repeating-linear-gradient(
            90deg,
            rgba(255,255,255,.045) 0,
            rgba(255,255,255,.045) 1px,
            transparent 1px,
            transparent 68px
        ),
        repeating-linear-gradient(
            180deg,
            rgba(255,255,255,.032) 0,
            rgba(255,255,255,.032) 1px,
            transparent 1px,
            transparent 68px
        );
    opacity: .42;
}

body.home .datmit-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(circle at 78% 34%, rgba(58,174,255,.22) 0%, rgba(58,174,255,.10) 18%, rgba(58,174,255,0) 42%),
        radial-gradient(circle at 72% 70%, rgba(66,171,255,.16) 0%, rgba(66,171,255,.08) 22%, rgba(66,171,255,0) 54%),
        linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(32,142,226,.10) 48%, rgba(63,179,255,.18) 100%);
}

/* contenitore testo: lo alziamo */
body.home .datmit-hero-inner {
    position: relative;
    z-index: 5;
    width: calc(100% - 96px);
    max-width: 1640px;
    margin: 0 auto;
    min-height: 920px;
    display: grid;
    grid-template-columns: minmax(680px, 920px) 1fr;
    align-items: start;
    padding-top: 138px;   /* questo è il valore principale che elimina il vuoto */
}

body.home .datmit-hero-copy {
    position: relative;
    z-index: 7;
    max-width: 920px;
    margin-top: 0;
    padding-top: 0;
}

body.home .datmit-eyebrow {
    margin: 0 0 22px;
    position: relative;
    z-index: 7;
}

body.home .datmit-hero h1 {
    margin: 0 0 26px;
    position: relative;
    z-index: 7;
}

body.home .datmit-hero-text {
    position: relative;
    z-index: 7;
    max-width: 880px;
    margin-bottom: 36px;
}

body.home .datmit-hero-actions {
    position: relative;
    z-index: 7;
}

/* visual full bleed, non più confinato solo a destra */
body.home .datmit-hero-visual {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

/* rete fibre full area */
body.home .datmit-hero-network {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    overflow: hidden;
}

/* orbite principali */
body.home .datmit-core {
    position: absolute;
    left: 78%;
    top: 74%;
    transform: translate(-50%, -50%);
}

body.home .datmit-orbit {
    position: absolute;
    left: 78%;
    top: 74%;
    transform: translate(-50%, -50%);
    border-color: rgba(117,198,255,.13);
}

body.home .datmit-orbit-1 {
    width: 220px;
    height: 220px;
}

body.home .datmit-orbit-2 {
    width: 420px;
    height: 420px;
}

body.home .datmit-orbit-3 {
    width: 720px;
    height: 720px;
}

/* =========================================================
   FIBRE
   ========================================================= */

body.home .datmit-fiber {
    position: absolute;
    display: block;
    height: 2px;
    border-radius: 999px;
    transform-origin: left center;
    opacity: .95;
    overflow: visible;
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,0) 0%,
            rgba(74,191,255,.10) 12%,
            rgba(83,201,255,.42) 50%,
            rgba(88,205,255,.18) 84%,
            rgba(0,0,0,0) 100%
        );
    box-shadow:
        0 0 14px rgba(57,186,255,.18),
        0 0 26px rgba(57,186,255,.10);
}

/* punti in corsa dentro le fibre */
body.home .datmit-fiber::before,
body.home .datmit-fiber::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    opacity: 0;
}

body.home .datmit-fiber::before {
    width: 8px;
    height: 8px;
    background: #3ec8ff;
    box-shadow:
        0 0 10px rgba(62,200,255,.95),
        0 0 22px rgba(62,200,255,.55);
    animation: datmitFiberRun 7.4s linear infinite;
}

body.home .datmit-fiber::after {
    width: 7px;
    height: 7px;
    background: #ff7b24;
    box-shadow:
        0 0 10px rgba(255,123,36,.95),
        0 0 24px rgba(255,123,36,.48);
    animation: datmitFiberRunWarm 9.4s linear infinite;
}

/* alcune fibre con punto rosso aggiuntivo */
body.home .datmit-fiber-2::after,
body.home .datmit-fiber-5::after,
body.home .datmit-fiber-7::after {
    background: #ff4b4b;
    box-shadow:
        0 0 10px rgba(255,75,75,.95),
        0 0 24px rgba(255,75,75,.50);
}

/* posizioni fibre */
body.home .datmit-fiber-1 {
    width: 980px;
    left: 52%;
    top: 30%;
    transform: rotate(-11deg);
}

body.home .datmit-fiber-2 {
    width: 850px;
    left: 45%;
    top: 44%;
    transform: rotate(8deg);
}

body.home .datmit-fiber-3 {
    width: 760px;
    left: 36%;
    top: 58%;
    transform: rotate(12deg);
}

body.home .datmit-fiber-4 {
    width: 980px;
    left: 18%;
    top: 73%;
    transform: rotate(0deg);
}

body.home .datmit-fiber-5 {
    width: 710px;
    left: 54%;
    top: 70%;
    transform: rotate(-8deg);
}

body.home .datmit-fiber-6 {
    width: 560px;
    left: 12%;
    top: 40%;
    transform: rotate(14deg);
}

body.home .datmit-fiber-7 {
    width: 640px;
    left: 10%;
    top: 52%;
    transform: rotate(-6deg);
}

body.home .datmit-fiber-8 {
    width: 920px;
    left: 28%;
    top: 20%;
    transform: rotate(2deg);
}

/* =========================================================
   CIRCUITI / TRACCE
   ========================================================= */

body.home .datmit-circuit {
    position: absolute;
    display: block;
    border-radius: 999px;
    opacity: .7;
    background: linear-gradient(90deg, rgba(0,0,0,0), rgba(68,186,255,.18), rgba(0,0,0,0));
}

body.home .datmit-circuit::after {
    content: "";
    position: absolute;
    right: 10%;
    top: 50%;
    width: 6px;
    height: 6px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #3ec8ff;
    box-shadow: 0 0 10px rgba(62,200,255,.75);
}

body.home .datmit-circuit-1 {
    width: 420px;
    height: 1px;
    left: 6%;
    top: 32%;
}

body.home .datmit-circuit-2 {
    width: 520px;
    height: 1px;
    left: 58%;
    top: 52%;
    transform: rotate(8deg);
}

body.home .datmit-circuit-3 {
    width: 400px;
    height: 1px;
    left: 4%;
    top: 66%;
}

body.home .datmit-circuit-4 {
    width: 540px;
    height: 1px;
    left: 46%;
    top: 84%;
    transform: rotate(-7deg);
}

/* =========================================================
   NODI / PUNTI LUMINOSI STATICI
   ========================================================= */

body.home .datmit-signal {
    position: absolute;
    display: block;
    border-radius: 50%;
    opacity: .95;
}

body.home .datmit-signal-1,
body.home .datmit-signal-4,
body.home .datmit-signal-7,
body.home .datmit-signal-10 {
    width: 10px;
    height: 10px;
    background: #3ec8ff;
    box-shadow: 0 0 12px rgba(62,200,255,.9), 0 0 24px rgba(62,200,255,.38);
}

body.home .datmit-signal-2,
body.home .datmit-signal-8,
body.home .datmit-signal-11 {
    width: 9px;
    height: 9px;
    background: #ff8f2a;
    box-shadow: 0 0 12px rgba(255,143,42,.9), 0 0 24px rgba(255,143,42,.40);
}

body.home .datmit-signal-3,
body.home .datmit-signal-6,
body.home .datmit-signal-12 {
    width: 8px;
    height: 8px;
    background: #ff4d4d;
    box-shadow: 0 0 12px rgba(255,77,77,.9), 0 0 24px rgba(255,77,77,.40);
}

body.home .datmit-signal-5,
body.home .datmit-signal-9 {
    width: 8px;
    height: 8px;
    background: #ffffff;
    box-shadow: 0 0 10px rgba(255,255,255,.95), 0 0 22px rgba(255,255,255,.32);
}

/* posizioni */
body.home .datmit-signal-1  { left: 63%; top: 26%; animation: datmitSignalFloat1 8s ease-in-out infinite; }
body.home .datmit-signal-2  { left: 73%; top: 25%; animation: datmitSignalFloat2 9s ease-in-out infinite; }
body.home .datmit-signal-3  { left: 84%; top: 35%; animation: datmitSignalFloat1 10s ease-in-out infinite; }
body.home .datmit-signal-4  { left: 61%; top: 47%; animation: datmitSignalFloat2 8.5s ease-in-out infinite; }
body.home .datmit-signal-5  { left: 72%; top: 51%; animation: datmitSignalFloat1 9.2s ease-in-out infinite; }
body.home .datmit-signal-6  { left: 81%; top: 60%; animation: datmitSignalFloat2 8.2s ease-in-out infinite; }
body.home .datmit-signal-7  { left: 66%; top: 72%; animation: datmitSignalFloat1 10.4s ease-in-out infinite; }
body.home .datmit-signal-8  { left: 77%; top: 78%; animation: datmitSignalFloat2 11s ease-in-out infinite; }
body.home .datmit-signal-9  { left: 58%; top: 64%; animation: datmitSignalFloat1 8.8s ease-in-out infinite; }
body.home .datmit-signal-10 { left: 23%; top: 67%; animation: datmitSignalFloat2 9.3s ease-in-out infinite; }
body.home .datmit-signal-11 { left: 36%; top: 58%; animation: datmitSignalFloat1 8.4s ease-in-out infinite; }
body.home .datmit-signal-12 { left: 18%; top: 77%; animation: datmitSignalFloat2 10.1s ease-in-out infinite; }

/* =========================================================
   ANIMAZIONI
   ========================================================= */

@keyframes datmitFiberRun {
    0%   { left: 0%;   opacity: 0; }
    8%   { opacity: 1; }
    92%  { opacity: 1; }
    100% { left: 100%; opacity: 0; }
}

@keyframes datmitFiberRunWarm {
    0%   { left: 100%; opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { left: 0%;   opacity: 0; }
}

@keyframes datmitSignalFloat1 {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(0, -8px); }
}

@keyframes datmitSignalFloat2 {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(6px, -6px); }
}

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

@media (max-width: 1360px) {
    body.home .datmit-hero-inner {
        grid-template-columns: minmax(620px, 820px) 1fr;
        padding-top: 124px;
    }

    body.home .datmit-hero {
        min-height: 860px;
    }
}

@media (max-width: 1100px) {
    body.home .datmit-hero-inner {
        width: calc(100% - 56px);
        grid-template-columns: 1fr;
        min-height: 820px;
        padding-top: 118px;
    }

    body.home .datmit-hero-copy {
        max-width: 760px;
    }

    body.home .datmit-core,
    body.home .datmit-orbit {
        left: 78%;
        top: 78%;
    }
}

@media (max-width: 760px) {
    body.home .datmit-hero {
        min-height: 760px;
    }

    body.home .datmit-hero-inner {
        width: calc(100% - 34px);
        padding-top: 105px;
        min-height: 760px;
    }

    body.home .datmit-eyebrow {
        margin-bottom: 16px;
    }

    body.home .datmit-fiber-6,
    body.home .datmit-fiber-7,
    body.home .datmit-fiber-8,
    body.home .datmit-circuit-3,
    body.home .datmit-circuit-4 {
        display: none;
    }
}



/* =========================================================
   DATMIT HERO COMPACT FINAL
   ========================================================= */

@media (min-width: 1361px) {

    body.home .datmit-hero {
        min-height: 700px;
    }

    body.home .datmit-hero-inner {
        min-height: 700px;
        padding-top: 100px;
        padding-bottom: 42px;
    }

}


/* Desktop medio */

@media (min-width: 1101px) and (max-width: 1360px) {

    body.home .datmit-hero {
        min-height: 680px;
    }

    body.home .datmit-hero-inner {
        min-height: 680px;
        padding-top: 100px;
        padding-bottom: 40px;
    }

}



/* =========================================================
   DATMIT HERO COMPACT V2
   ========================================================= */

@media (min-width: 1361px) {

    body.home .datmit-hero {
        min-height: 610px;
    }

    body.home .datmit-hero-inner {
        min-height: 610px;
        padding-top: 100px;
        padding-bottom: 20px;
    }

    body.home .datmit-hero h1,
    body.home .datmit-hero-title {
        max-width: 760px;
        font-size: clamp(48px, 4.3vw, 70px);
        line-height: .96;
        margin-bottom: 22px;
    }

    body.home .datmit-hero-text {
        max-width: 780px;
        font-size: 17px;
        line-height: 1.55;
        margin-bottom: 28px;
    }

}


/* Desktop medio */

@media (min-width: 1101px) and (max-width: 1360px) {

    body.home .datmit-hero {
        min-height: 590px;
    }

    body.home .datmit-hero-inner {
        min-height: 590px;
        padding-top: 95px;
        padding-bottom: 18px;
    }

    body.home .datmit-hero h1,
    body.home .datmit-hero-title {
        max-width: 720px;
        font-size: clamp(46px, 4.5vw, 64px);
        line-height: .97;
        margin-bottom: 20px;
    }

    body.home .datmit-hero-text {
        max-width: 720px;
        font-size: 16px;
        line-height: 1.5;
        margin-bottom: 24px;
    }

}


/* Riduce leggermente anche lo spazio dei pulsanti */

body.home .datmit-hero-actions {
    margin-top: 24px;
    margin-bottom: 0;
}



/* =========================================================
   DATMIT FOOTER COMPACT
   ========================================================= */

.datmit-footer {
    padding-top: 0;
}

.datmit-footer-inner {
    max-width: 1540px;
    margin: 0 auto;
    padding: 48px 34px 22px;
}

.datmit-footer-main {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 70px;
    align-items: start;
}

.datmit-footer-brand {
    max-width: 520px;
}

.datmit-footer-logo-image {
    width: 165px;
    height: auto;
    margin-bottom: 18px;
}

.datmit-footer-brand > p {
    margin: 0 0 22px;
    max-width: 500px;
    font-size: 15px;
    line-height: 1.5;
}

.datmit-footer-contact {
    margin-top: 18px;
}

.datmit-footer-contact p {
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 1.5;
}

.datmit-footer-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 36px;
}

.datmit-footer-column h4 {
    margin: 0 0 16px;
    font-size: 12px;
    letter-spacing: .12em;
}

.datmit-footer-column a {
    margin-bottom: 9px;
    font-size: 14px;
    line-height: 1.35;
}

.datmit-footer-bottom {
    margin-top: 36px;
    padding-top: 18px;
    min-height: auto;

    display: flex;
    align-items: center;
    justify-content: space-between;

    font-size: 12px;
}

.datmit-footer-legal {
    gap: 10px;
}

/* Tablet */

@media (max-width: 980px) {

    .datmit-footer-inner {
        padding: 40px 24px 20px;
    }

    .datmit-footer-main {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .datmit-footer-columns {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

}

/* Mobile */

@media (max-width: 640px) {

    .datmit-footer-inner {
        padding: 34px 18px 18px;
    }

    .datmit-footer-logo-image {
        width: 145px;
    }

    .datmit-footer-columns {
        grid-template-columns: 1fr 1fr;
        gap: 26px 20px;
    }

    .datmit-footer-bottom {
        margin-top: 28px;
        padding-top: 16px;

        align-items: flex-start;
        flex-direction: column;

        gap: 10px;
    }

}



/* =========================================================
   DATMIT FOOTER ULTRA COMPACT
   ========================================================= */

.datmit-footer-inner {
    max-width: 1540px;
    margin: 0 auto;

    padding-top: 28px;
    padding-right: 34px;
    padding-bottom: 14px;
    padding-left: 34px;
}

.datmit-footer-main {
    display: grid;
    grid-template-columns: 1.45fr 1fr;

    gap: 44px;

    align-items: start;
}

.datmit-footer-brand {
    max-width: 520px;
}

.datmit-footer-logo-image {
    width: 150px;
    margin-bottom: 12px;
}

.datmit-footer-brand > p {
    margin: 0 0 14px;

    font-size: 14px;
    line-height: 1.45;
}

.datmit-footer-contact {
    margin-top: 10px;
}

.datmit-footer-contact p {
    margin: 0 0 6px;

    font-size: 13px;
    line-height: 1.4;
}


/* colonne */

.datmit-footer-columns {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(130px, 1fr));

    gap: 24px;
}

.datmit-footer-column h4 {
    margin: 0 0 10px;

    font-size: 11px;
    letter-spacing: .12em;
}

.datmit-footer-column a {
    margin-bottom: 6px;

    font-size: 13px;
    line-height: 1.25;
}


/* bottom */

.datmit-footer-bottom {
    margin-top: 18px;
    padding-top: 12px;

    min-height: 0;

    display: flex;
    align-items: center;
    justify-content: space-between;

    font-size: 11px;

    line-height: 1.2;
}

.datmit-footer-legal {
    gap: 8px;
}


/* tablet */

@media (max-width: 980px) {

    .datmit-footer-inner {
        padding:
            26px 22px 14px;
    }

    .datmit-footer-main {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .datmit-footer-columns {
        grid-template-columns:
            repeat(3, 1fr);

        gap: 18px;
    }

}


/* mobile */

@media (max-width: 640px) {

    .datmit-footer-inner {
        padding:
            24px 16px 12px;
    }

    .datmit-footer-logo-image {
        width: 135px;
    }

    .datmit-footer-columns {
        grid-template-columns:
            1fr 1fr;

        gap:
            18px 16px;
    }

    .datmit-footer-bottom {
        margin-top: 16px;
        padding-top: 10px;

        flex-direction: column;
        align-items: flex-start;

        gap: 7px;
    }

}



/* =========================================================
   DATMIT FOOTER MAX COMPACT
   ========================================================= */

.datmit-footer-inner {
    max-width: 1540px;
    margin: 0 auto;
    padding: 26px 34px 12px;
}

.datmit-footer-main {
    display: grid;
    grid-template-columns: minmax(420px, 1.2fr) minmax(620px, .95fr);
    gap: 34px;
    align-items: start;
}


/* ---------------------------------------------------------
   BRAND / CONTACT BLOCK
   --------------------------------------------------------- */

.datmit-footer-brand {
    max-width: 520px;
}

.datmit-footer-logo-image {
    width: 145px;
    margin-bottom: 10px;
}

.datmit-footer-brand > p {
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.35;
}

.datmit-footer-contact {
    margin-top: 8px;
}

.datmit-footer-contact p {
    margin: 0 0 5px;
    font-size: 13px;
    line-height: 1.35;
}


/* ---------------------------------------------------------
   RIGHT SIDE - MUCH MORE COMPACT
   --------------------------------------------------------- */

.datmit-footer-columns {
    display: grid;
    grid-template-columns: .85fr 1.35fr .85fr;
    gap: 22px;
    align-items: start;
}

.datmit-footer-column {
    min-width: 0;
}

.datmit-footer-column h4 {
    margin: 0 0 8px;
    font-size: 10px;
    line-height: 1.2;
    letter-spacing: .11em;
}

.datmit-footer-column a {
    display: block;
    margin: 0 0 4px;
    font-size: 12px;
    line-height: 1.25;
}


/* divisioni più dense su due colonne */

.datmit-footer-column:nth-child(2) {
    display: grid;
    grid-template-columns: repeat(2, minmax(90px, 1fr));
    column-gap: 18px;
    row-gap: 0;
}

.datmit-footer-column:nth-child(2) h4 {
    grid-column: 1 / -1;
}

.datmit-footer-column:nth-child(2) a {
    margin-bottom: 4px;
}


/* ---------------------------------------------------------
   FOOTER BOTTOM
   --------------------------------------------------------- */

.datmit-footer-bottom {
    margin-top: 14px;
    padding-top: 10px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    font-size: 10px;
    line-height: 1.2;
}

.datmit-footer-legal {
    display: flex;
    gap: 7px;
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 980px) {

    .datmit-footer-main {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .datmit-footer-columns {
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
    }

    .datmit-footer-column:nth-child(2) {
        grid-template-columns: 1fr;
    }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 640px) {

    .datmit-footer-inner {
        padding: 22px 16px 10px;
    }

    .datmit-footer-columns {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .datmit-footer-column:nth-child(2) {
        grid-template-columns: 1fr;
    }

    .datmit-footer-bottom {
        margin-top: 12px;
        padding-top: 8px;
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }

}


/* =========================================================
   DATMIT LOGO FIX - HEADER / FOOTER
   logo invertito su sfondo sito
   ========================================================= */

.datmit-brand,
.datmit-footer-brand,
.datmit-footer-logo {
    display: flex;
    align-items: center;
}

.datmit-brand img,
.datmit-footer-brand img,
.datmit-footer-logo img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
}

/* Header */
.datmit-brand {
    max-width: 260px;
}

.datmit-brand img {
    max-height: 72px;
}

/* Footer */
.datmit-footer-brand,
.datmit-footer-logo {
    max-width: 230px;
}

.datmit-footer-brand img,
.datmit-footer-logo img {
    max-height: 62px;
}

/* Mobile */
@media (max-width: 900px) {
    .datmit-brand {
        max-width: 200px;
    }

    .datmit-brand img {
        max-height: 56px;
    }

    .datmit-footer-brand,
    .datmit-footer-logo {
        max-width: 180px;
    }

    .datmit-footer-brand img,
    .datmit-footer-logo img {
        max-height: 48px;
    }
}


/* =========================================================
   DATMIT FOOTER - NAV ONLY
   ========================================================= */

.datmit-footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 34px 12px;
}

.datmit-footer-main {
    display: block;
}

.datmit-footer-columns {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(3, minmax(160px, 1fr));

    gap: 50px;

    margin: 0 auto;
}

.datmit-footer-column {
    min-width: 0;
}

.datmit-footer-column h4 {
    margin: 0 0 8px;

    font-size: 10px;
    line-height: 1.2;

    letter-spacing: .12em;
}

.datmit-footer-column a {
    display: block;

    margin: 0 0 4px;

    font-size: 12px;
    line-height: 1.3;
}


/* Divisioni su due colonne */

.datmit-footer-column:nth-child(2) {
    display: grid;

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

    column-gap: 20px;
}

.datmit-footer-column:nth-child(2) h4 {
    grid-column: 1 / -1;
}


/* fascia legale */

.datmit-footer-bottom {
    margin-top: 18px;
    padding-top: 10px;

    font-size: 10px;
    line-height: 1.2;
}


/* mobile */

@media (max-width: 700px) {

    .datmit-footer-inner {
        padding: 22px 18px 12px;
    }

    .datmit-footer-columns {
        grid-template-columns:
            repeat(2, 1fr);

        gap: 20px;
    }

    .datmit-footer-column:nth-child(2) {
        grid-template-columns: 1fr;
    }

}



/* =========================================================
   DATMIT FOOTER - REMOVE ALL EMPTY SPACE
   ========================================================= */

.datmit-footer {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
}

.datmit-footer-inner {
    min-height: 0 !important;
    height: auto !important;

    max-width: 1200px;

    padding: 18px 28px 10px !important;
    margin: 0 auto !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 12px !important;
}

.datmit-footer-main {
    min-height: 0 !important;
    height: auto !important;

    padding: 0 !important;
    margin: 0 !important;
}

.datmit-footer-columns {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;
}

.datmit-footer-column {
    min-height: 0 !important;
    height: auto !important;
}

.datmit-footer-bottom {
    min-height: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 10px 0 0 !important;

    border-top:
        1px solid rgba(255,255,255,.10);

    line-height: 1.2 !important;
}

@media (max-width: 700px) {

    .datmit-footer-inner {
        padding: 16px 18px 9px !important;
        gap: 10px !important;
    }

    .datmit-footer-bottom {
        padding-top: 9px !important;
    }

}



/* =========================================================
   DATMIT CARDS - COMPACT 50%
   ========================================================= */

body.home .datmit-home-card {
    min-height: 220px;
}

body.home .datmit-card-visual {
    height: 95px;
}

body.home .datmit-card-code {
    left: 14px;
    top: 10px;

    font-size: 9px;
}

body.home .datmit-card-symbol {
    left: 16px;
    bottom: 10px;

    font-size: 28px;
}

body.home .datmit-card-visual::before {
    background-size: 28px 28px;
}

body.home .datmit-card-visual::after {
    width: 120px;
    height: 120px;

    right: -40px;
    bottom: -65px;
}

body.home .datmit-card-content {
    padding: 16px 16px 14px;
}

body.home .datmit-card-content h3 {
    margin-bottom: 8px;

    font-size: 15px;
    line-height: 1.2;
}

body.home .datmit-card-content p {
    font-size: 12px;
    line-height: 1.4;
}

body.home .datmit-card-link {
    padding-top: 12px;

    font-size: 11px;
}

/* riduciamo anche lo spazio fra le card */

body.home .datmit-home-cards {
    gap: 10px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1180px) {

    body.home .datmit-home-card {
        min-height: 210px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    body.home .datmit-home-card {
        min-height: 200px;
    }

    body.home .datmit-card-visual {
        height: 86px;
    }

}



/* =========================================================
   DATMIT HEADER LOGO - LARGER
   ========================================================= */

body.home .datmit-brand {
    max-width: 220px;
}

body.home .datmit-logo-image {
    width: 200px !important;
    height: auto !important;
    max-height: none !important;
}

body.home .datmit-header-inner {
    min-height: 92px;
}

@media (max-width: 1180px) {

    body.home .datmit-logo-image {
        width: 180px !important;
    }

}

@media (max-width: 760px) {

    body.home .datmit-logo-image {
        width: 155px !important;
    }

}



/* =========================================================
   DATMIT HEADER LOGO - EXTRA LARGE
   ========================================================= */

body.home .datmit-header-inner {
    min-height: 122px;
    align-items: center;
}

body.home .datmit-brand {
    width: 380px;
    max-width: 380px;
    flex: 0 0 380px;
}

body.home .datmit-logo-image {
    width: 360px !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    display: block;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-brand {
        width: 320px;
        max-width: 320px;
        flex-basis: 320px;
    }

    body.home .datmit-logo-image {
        width: 305px !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-header-inner {
        min-height: 100px;
    }

    body.home .datmit-brand {
        width: 250px;
        max-width: 250px;
        flex-basis: 250px;
    }

    body.home .datmit-logo-image {
        width: 240px !important;
    }

}


/* Mobile */

@media (max-width: 760px) {

    body.home .datmit-header-inner {
        min-height: 88px;
    }

    body.home .datmit-brand {
        width: 205px;
        max-width: 205px;
        flex-basis: 205px;
    }

    body.home .datmit-logo-image {
        width: 195px !important;
    }

}



/* =========================================================
   DATMIT HEADER LOGO - FIX DEFINITIVO HOME
   Mostra SOLO il logo light / negativo
   ========================================================= */

body.home .datmit-brand {
    width: 360px !important;
    max-width: 360px !important;
    flex: 0 0 360px !important;

    display: flex !important;
    align-items: center !important;
}


/* NASCONDE DEFINITIVAMENTE IL LOGO DARK SULLA HOME */

body.home .datmit-logo-dark {
    display: none !important;
}


/* MOSTRA E INGRANDISCE SOLO IL LOGO LIGHT */

body.home .datmit-logo-light {
    display: block !important;

    width: 340px !important;
    height: auto !important;

    max-width: none !important;
    max-height: none !important;

    object-fit: contain !important;

    background: transparent !important;
}


/* Header proporzionato al logo */

body.home .datmit-header-inner {
    min-height: 112px !important;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-brand {
        width: 310px !important;
        max-width: 310px !important;
        flex-basis: 310px !important;
    }

    body.home .datmit-logo-light {
        width: 295px !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-brand {
        width: 240px !important;
        max-width: 240px !important;
        flex-basis: 240px !important;
    }

    body.home .datmit-logo-light {
        width: 225px !important;
    }

}


/* Mobile */

@media (max-width: 760px) {

    body.home .datmit-brand {
        width: 190px !important;
        max-width: 190px !important;
        flex-basis: 190px !important;
    }

    body.home .datmit-logo-light {
        width: 180px !important;
    }

}



/* =========================================================
   DATMIT HEADER LOGO - FINAL SIZE AFTER TRIM
   ========================================================= */

body.home .datmit-brand {
    width: 390px !important;
    max-width: 390px !important;
    flex: 0 0 390px !important;
}

body.home .datmit-logo-dark {
    display: none !important;
}

body.home .datmit-logo-light {
    display: block !important;

    width: 370px !important;
    height: auto !important;

    max-width: none !important;
    max-height: none !important;

    background: transparent !important;
}

body.home .datmit-header-inner {
    min-height: 112px !important;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-brand {
        width: 330px !important;
        max-width: 330px !important;
        flex-basis: 330px !important;
    }

    body.home .datmit-logo-light {
        width: 315px !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-brand {
        width: 250px !important;
        max-width: 250px !important;
        flex-basis: 250px !important;
    }

    body.home .datmit-logo-light {
        width: 235px !important;
    }

}


/* Mobile */

@media (max-width: 760px) {

    body.home .datmit-brand {
        width: 195px !important;
        max-width: 195px !important;
        flex-basis: 195px !important;
    }

    body.home .datmit-logo-light {
        width: 185px !important;
    }

}



/* =========================================================
   DATMIT HEADER LOGO - BALANCED SIZE
   ========================================================= */

body.home .datmit-brand {
    width: 285px !important;
    max-width: 285px !important;
    flex: 0 0 285px !important;
}

body.home .datmit-logo-dark {
    display: none !important;
}

body.home .datmit-logo-light {
    display: block !important;

    width: 270px !important;
    height: auto !important;

    max-width: none !important;
    max-height: none !important;
}

body.home .datmit-header-inner {
    min-height: 96px !important;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-brand {
        width: 250px !important;
        max-width: 250px !important;
        flex-basis: 250px !important;
    }

    body.home .datmit-logo-light {
        width: 235px !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-brand {
        width: 220px !important;
        max-width: 220px !important;
        flex-basis: 220px !important;
    }

    body.home .datmit-logo-light {
        width: 205px !important;
    }

}


/* Mobile */

@media (max-width: 760px) {

    body.home .datmit-brand {
        width: 175px !important;
        max-width: 175px !important;
        flex-basis: 175px !important;
    }

    body.home .datmit-logo-light {
        width: 165px !important;
    }

}



/* =========================================================
   DATMIT DIVISION CARDS - REAL IMAGES
   ========================================================= */

/*
 * Le immagini sostituiscono il visual astratto precedente.
 */

body.home .datmit-card-visual {
    position: relative;

    height: 115px !important;
    min-height: 115px !important;

    background-color: #061422;

    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;

    overflow: hidden;
}


/*
 * Leggerissimo overlay per uniformare tutte le immagini
 * con il design generale DatMit.
 */

body.home .datmit-card-visual::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(2,10,18,.02) 0%,
            rgba(2,10,18,.08) 65%,
            rgba(2,10,18,.28) 100%
        );

    pointer-events: none;
}


/*
 * Eliminiamo il vecchio cerchio grafico.
 */

body.home .datmit-card-visual::after {
    display: none !important;
}


/*
 * Eliminiamo i vecchi simboli CSS:
 * le immagini contengono già il visual della divisione.
 */

body.home .datmit-card-symbol {
    display: none !important;
}


/* =========================================================
   CONNECT
   ========================================================= */

body.home .datmit-card-connect .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/connect.png');
}


/* =========================================================
   IT
   ========================================================= */

body.home .datmit-card-it .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/cloud.png');
}


/* =========================================================
   SECURITY
   ========================================================= */

body.home .datmit-card-security .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/security.png');
}


/* =========================================================
   SYSTEMS
   ========================================================= */

body.home .datmit-card-systems .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/systems.png');
}


/* =========================================================
   CREATIVE
   ========================================================= */

body.home .datmit-card-creative .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/creative.png');
}


/* =========================================================
   STORE
   ========================================================= */

body.home .datmit-card-store .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/store.png');
}


/* =========================================================
   AI
   ========================================================= */

body.home .datmit-card-ai .datmit-card-visual {
    background-image:
        url('/wp-content/themes/datmit/assets/images/ai.png');
}


/* =========================================================
   CARD IMAGE RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    body.home .datmit-card-visual {
        height: 105px !important;
        min-height: 105px !important;
    }

}

@media (max-width: 760px) {

    body.home .datmit-card-visual {
        height: 125px !important;
        min-height: 125px !important;
    }

}



/* =========================================================
   DATMIT CARD FIT FIX
   Riduce la porzione visibile delle immagini e compatta le card
   ========================================================= */

body.home .datmit-home-cards {
    gap: 16px;
}

body.home .datmit-home-card {
    min-height: auto !important;
}

body.home .datmit-card-visual {
    height: 96px !important;
    min-height: 96px !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
}

/* piccoli aggiustamenti per immagine */
body.home .datmit-card-connect .datmit-card-visual {
    background-position: center top !important;
}

body.home .datmit-card-it .datmit-card-visual {
    background-position: center top !important;
}

body.home .datmit-card-security .datmit-card-visual {
    background-position: center top !important;
}

body.home .datmit-card-systems .datmit-card-visual {
    background-position: center top !important;
}

body.home .datmit-card-creative .datmit-card-visual {
    background-position: center top !important;
}

body.home .datmit-card-store .datmit-card-visual {
    background-position: center top !important;
}

body.home .datmit-card-ai .datmit-card-visual {
    background-position: center top !important;
}

/* compatta contenuti testuali */
body.home .datmit-card-content {
    padding: 20px 24px 18px !important;
}

body.home .datmit-home-card h3 {
    margin: 0 0 12px !important;
    font-size: 1rem !important;
    line-height: 1.2 !important;
}

body.home .datmit-home-card p {
    margin: 0 0 16px !important;
    font-size: 0.95rem !important;
    line-height: 1.45 !important;
}

body.home .datmit-card-link {
    font-size: 0.98rem !important;
}

/* responsive */
@media (max-width: 1180px) {
    body.home .datmit-card-visual {
        height: 88px !important;
        min-height: 88px !important;
    }

    body.home .datmit-card-content {
        padding: 18px 20px 16px !important;
    }
}

@media (max-width: 760px) {
    body.home .datmit-card-visual {
        height: 82px !important;
        min-height: 82px !important;
    }

    body.home .datmit-home-card h3 {
        font-size: 0.95rem !important;
    }

    body.home .datmit-home-card p {
        font-size: 0.90rem !important;
    }
}



/* =========================================================
   DATMIT CARDS - VERTICAL LAYOUT
   ========================================================= */

body.home .datmit-home-cards {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

body.home .datmit-home-card {
    display: flex !important;
    flex-direction: column !important;

    min-height: 360px !important;

    border-radius: 12px !important;
    overflow: hidden !important;
}


/* ---------------------------------------------------------
   IMAGE
   --------------------------------------------------------- */

body.home .datmit-card-visual {
    width: 100% !important;

    height: 210px !important;
    min-height: 210px !important;

    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;

    border-bottom:
        1px solid rgba(255,255,255,.08);
}


/* ---------------------------------------------------------
   CONTENT
   --------------------------------------------------------- */

body.home .datmit-card-content {
    flex: 1 1 auto !important;

    display: flex !important;
    flex-direction: column !important;

    padding: 18px 18px 16px !important;
}

body.home .datmit-card-content h3 {
    margin: 0 0 10px !important;

    font-size: 16px !important;
    line-height: 1.2 !important;
}

body.home .datmit-card-content p {
    margin: 0 !important;

    font-size: 13px !important;
    line-height: 1.45 !important;
}

body.home .datmit-card-link {
    margin-top: auto !important;
    padding-top: 16px !important;

    font-size: 12px !important;
}


/* ---------------------------------------------------------
   SECONDA RIGA
   --------------------------------------------------------- */

body.home .datmit-card-creative,
body.home .datmit-card-store,
body.home .datmit-card-ai {
    grid-column: auto !important;
}


/*
 * Per centrare 3 card nella seconda riga:
 * Creative, Store e AI occupano 3 colonne su 4.
 */

body.home .datmit-card-creative {
    grid-column: 1 / 2 !important;
}

body.home .datmit-card-store {
    grid-column: 2 / 3 !important;
}

body.home .datmit-card-ai {
    grid-column: 3 / 4 !important;
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1180px) {

    body.home .datmit-home-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.home .datmit-card-creative,
    body.home .datmit-card-store,
    body.home .datmit-card-ai {
        grid-column: auto !important;
    }

    body.home .datmit-card-visual {
        height: 200px !important;
        min-height: 200px !important;
    }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {

    body.home .datmit-home-cards {
        grid-template-columns: 1fr !important;
    }

    body.home .datmit-home-card {
        min-height: 340px !important;
    }

    body.home .datmit-card-visual {
        height: 220px !important;
        min-height: 220px !important;
    }

}



/* =========================================================
   DATMIT CARDS - FINAL UNIFORM SIZE
   Tutte le card uguali alle ultime tre
   ========================================================= */

body.home .datmit-home-cards {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
}


/*
 * IMPORTANTISSIMO:
 * annulla le vecchie regole grid-column: span 3
 * che rendevano enormi le prime quattro card.
 */

body.home .datmit-home-card,
body.home .datmit-card-connect,
body.home .datmit-card-it,
body.home .datmit-card-security,
body.home .datmit-card-systems,
body.home .datmit-card-creative,
body.home .datmit-card-store,
body.home .datmit-card-ai {
    grid-column: auto !important;

    width: 100% !important;
    min-width: 0 !important;

    min-height: 330px !important;
}


/* =========================================================
   IMMAGINE
   ========================================================= */

body.home .datmit-card-visual {
    width: 100% !important;

    height: 180px !important;
    min-height: 180px !important;

    background-repeat: no-repeat !important;

    /*
     * Cover mantiene la fotografia piena.
     * Essendo ora le card strette, il crop sarà molto più corretto.
     */
    background-size: cover !important;

    background-position: center top !important;
}


/* leggermente diverso per alcune immagini */

body.home .datmit-card-connect .datmit-card-visual {
    background-position: center 10% !important;
}

body.home .datmit-card-it .datmit-card-visual {
    background-position: center 8% !important;
}

body.home .datmit-card-security .datmit-card-visual {
    background-position: center 5% !important;
}

body.home .datmit-card-systems .datmit-card-visual {
    background-position: center 5% !important;
}

body.home .datmit-card-creative .datmit-card-visual {
    background-position: center 8% !important;
}

body.home .datmit-card-store .datmit-card-visual {
    background-position: center 8% !important;
}

body.home .datmit-card-ai .datmit-card-visual {
    background-position: center 5% !important;
}


/* =========================================================
   TESTO
   ========================================================= */

body.home .datmit-card-content {
    flex: 1 1 auto !important;

    display: flex !important;
    flex-direction: column !important;

    padding: 16px 16px 14px !important;
}

body.home .datmit-card-content h3 {
    margin: 0 0 8px !important;

    font-size: 15px !important;
    line-height: 1.2 !important;
}

body.home .datmit-card-content p {
    margin: 0 !important;

    font-size: 12px !important;
    line-height: 1.4 !important;
}

body.home .datmit-card-link {
    margin-top: auto !important;
    padding-top: 14px !important;

    font-size: 11px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1180px) {

    body.home .datmit-home-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.home .datmit-home-card {
        min-height: 320px !important;
    }

    body.home .datmit-card-visual {
        height: 175px !important;
        min-height: 175px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    body.home .datmit-home-cards {
        grid-template-columns: 1fr !important;
    }

    body.home .datmit-home-card {
        min-height: 320px !important;
    }

    body.home .datmit-card-visual {
        height: 190px !important;
        min-height: 190px !important;
    }

}



/* =========================================================
   DATMIT DYNAMIC FOOTER DIVIDER
   Elimina fascia bianca WordPress + separatore luminoso
   ========================================================= */

/*
 * Elimina il block-gap generato da WordPress
 * tra contenuto pagina e template-part footer.
 */

body.home footer.wp-block-template-part,
body.home .wp-block-template-part:last-child {
    margin-block-start: 0 !important;
    margin-top: 0 !important;
}


/*
 * Nessun margine dopo la fascia certificazioni.
 */

body.home .datmit-credentials {
    margin-bottom: 0 !important;
}


/*
 * Footer attaccato direttamente alle certificazioni.
 */

body.home .datmit-footer {
    position: relative;

    margin-top: 0 !important;
    padding-top: 0 !important;

    background: #020a11;
}


/* =========================================================
   DIVISORE DINAMICO
   ========================================================= */

body.home .datmit-footer::before {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    top: 0;

    height: 5px;

    z-index: 10;

    background:
        linear-gradient(
            90deg,
            #168fff 0%,
            #35d5ff 20%,
            #148cff 40%,
            #ff8a28 58%,
            #ff4d67 72%,
            #a35cff 88%,
            #168fff 100%
        );

    background-size: 300% 100%;

    box-shadow:
        0 0 10px rgba(46,184,255,.40),
        0 0 22px rgba(46,184,255,.16);

    animation:
        datmitFooterFlow 9s linear infinite;
}


/*
 * Seconda luce molto sottile e diffusa.
 */

body.home .datmit-footer::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    top: 5px;

    height: 14px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(30,157,255,.12),
            rgba(57,211,255,.05),
            rgba(255,126,43,.07),
            rgba(162,88,255,.08),
            rgba(30,157,255,.12)
        );

    filter: blur(8px);

    opacity: .65;
}


@keyframes datmitFooterFlow {

    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 300% 50%;
    }

}


/*
 * Nessuna animazione se il sistema la disabilita.
 */

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

    body.home .datmit-footer::before {
        animation: none;
    }

}



/* =========================================================
   DATMIT HEADER MENU - LARGER TEXT
   ========================================================= */

body.home .datmit-nav {
    gap: 34px !important;
}

body.home .datmit-nav a {
    font-size: 17px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: -0.01em !important;
}


/* Remote Support leggermente più proporzionato */

body.home .datmit-client-area {
    font-size: 15px !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-nav {
        gap: 27px !important;
    }

    body.home .datmit-nav a {
        font-size: 16px !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-nav a {
        font-size: 15px !important;
    }

}



/* =========================================================
   DATMIT HEADER MENU - EXTRA LARGE
   ========================================================= */

body.home .datmit-nav {
    gap: 38px !important;
}

body.home .datmit-nav a {
    font-size: 19px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: -0.01em !important;
}

body.home .datmit-client-area {
    font-size: 16px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-nav {
        gap: 30px !important;
    }

    body.home .datmit-nav a {
        font-size: 18px !important;
    }

    body.home .datmit-client-area {
        font-size: 15px !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-nav a {
        font-size: 16px !important;
    }

}



/* =========================================================
   DATMIT HOME FINAL DYNAMIC TUNING
   2026-10
   ========================================================= */


/* =========================================================
   LOGO PIÙ GRANDE
   ========================================================= */

body.home .datmit-brand {
    width: 360px !important;
    max-width: 360px !important;
    flex: 0 0 360px !important;
}

body.home .datmit-logo-dark {
    display: none !important;
}

body.home .datmit-logo-light {
    display: block !important;

    width: 340px !important;
    height: auto !important;

    max-width: none !important;
    max-height: none !important;
}

body.home .datmit-header-inner {
    min-height: 112px !important;
}


/* =========================================================
   HERO - TESTI PIÙ COMPATTI
   ========================================================= */

body.home .datmit-hero h1,
body.home .datmit-hero-title {
    max-width: 760px !important;

    font-size: clamp(48px, 4.1vw, 64px) !important;

    line-height: .98 !important;

    letter-spacing: -.045em !important;

    margin-bottom: 24px !important;
}

body.home .datmit-eyebrow {
    font-size: 11px !important;
    letter-spacing: .18em !important;
}

body.home .datmit-hero-text {
    max-width: 760px !important;

    font-size: 16px !important;
    line-height: 1.55 !important;
}


/* =========================================================
   TITOLO DIVISIONI PIÙ PICCOLO
   ========================================================= */

body.home .datmit-divisions-heading h2 {
    font-size: clamp(34px, 3vw, 50px) !important;
    line-height: 1 !important;
}

body.home .datmit-divisions-heading > p {
    font-size: 14px !important;
    line-height: 1.5 !important;
}


/* =========================================================
   PIÙ FIBRE
   ========================================================= */

body.home .datmit-fiber {
    opacity: .88 !important;

    box-shadow:
        0 0 10px rgba(48,190,255,.23),
        0 0 22px rgba(48,190,255,.10) !important;
}


/* fibre aggiuntive */

body.home .datmit-fiber-9 {
    width: 1100px;
    left: 2%;
    top: 24%;
    transform: rotate(6deg);
}

body.home .datmit-fiber-10 {
    width: 980px;
    left: 15%;
    top: 38%;
    transform: rotate(-10deg);
}

body.home .datmit-fiber-11 {
    width: 1150px;
    left: 4%;
    top: 48%;
    transform: rotate(11deg);
}

body.home .datmit-fiber-12 {
    width: 900px;
    left: 32%;
    top: 62%;
    transform: rotate(-15deg);
}

body.home .datmit-fiber-13 {
    width: 1250px;
    left: 8%;
    top: 80%;
    transform: rotate(5deg);
}

body.home .datmit-fiber-14 {
    width: 800px;
    left: 52%;
    top: 18%;
    transform: rotate(16deg);
}


/* circuiti aggiuntivi */

body.home .datmit-circuit-5 {
    width: 620px;
    height: 1px;
    left: 18%;
    top: 30%;
    transform: rotate(-4deg);
}

body.home .datmit-circuit-6 {
    width: 720px;
    height: 1px;
    left: 38%;
    top: 56%;
    transform: rotate(11deg);
}

body.home .datmit-circuit-7 {
    width: 690px;
    height: 1px;
    left: 7%;
    top: 85%;
    transform: rotate(-7deg);
}


/* =========================================================
   SEGNALI SULLE FIBRE - PIÙ VELOCI
   ========================================================= */

/*
 * I punti che viaggiano dentro ogni fibra diventano molto più
 * rapidi rispetto ai precedenti 7-9 secondi.
 */

body.home .datmit-fiber::before {
    animation-duration: 3.4s !important;
}

body.home .datmit-fiber::after {
    animation-duration: 4.3s !important;
}


/*
 * sfalsiamo le partenze per non far muovere tutto contemporaneamente
 */

body.home .datmit-fiber-2::before,
body.home .datmit-fiber-6::before,
body.home .datmit-fiber-10::before,
body.home .datmit-fiber-14::before {
    animation-delay: -1.3s !important;
}

body.home .datmit-fiber-3::after,
body.home .datmit-fiber-7::after,
body.home .datmit-fiber-11::after {
    animation-delay: -2.1s !important;
}


/* =========================================================
   NUOVI SEGNALI STATICI / FLUTTUANTI
   ========================================================= */

body.home .datmit-signal-13,
body.home .datmit-signal-17,
body.home .datmit-signal-21 {
    width: 9px;
    height: 9px;

    background: #35d5ff;

    box-shadow:
        0 0 10px rgba(53,213,255,.95),
        0 0 24px rgba(53,213,255,.48);
}

body.home .datmit-signal-14,
body.home .datmit-signal-18,
body.home .datmit-signal-22 {
    width: 8px;
    height: 8px;

    background: #ff922e;

    box-shadow:
        0 0 10px rgba(255,146,46,.95),
        0 0 25px rgba(255,146,46,.48);
}

body.home .datmit-signal-15,
body.home .datmit-signal-19,
body.home .datmit-signal-23 {
    width: 8px;
    height: 8px;

    background: #ff4d55;

    box-shadow:
        0 0 10px rgba(255,77,85,.95),
        0 0 25px rgba(255,77,85,.48);
}

body.home .datmit-signal-16,
body.home .datmit-signal-20,
body.home .datmit-signal-24 {
    width: 7px;
    height: 7px;

    background: #ffffff;

    box-shadow:
        0 0 10px rgba(255,255,255,.95),
        0 0 22px rgba(255,255,255,.45);
}


/* posizioni */

body.home .datmit-signal-13 {
    left: 27%;
    top: 20%;
    animation: datmitSignalFastA 3.8s ease-in-out infinite;
}

body.home .datmit-signal-14 {
    left: 39%;
    top: 27%;
    animation: datmitSignalFastB 4.2s ease-in-out infinite;
}

body.home .datmit-signal-15 {
    left: 50%;
    top: 35%;
    animation: datmitSignalFastA 3.5s ease-in-out infinite;
}

body.home .datmit-signal-16 {
    left: 58%;
    top: 43%;
    animation: datmitSignalFastB 4s ease-in-out infinite;
}

body.home .datmit-signal-17 {
    left: 70%;
    top: 22%;
    animation: datmitSignalFastA 3.2s ease-in-out infinite;
}

body.home .datmit-signal-18 {
    left: 82%;
    top: 31%;
    animation: datmitSignalFastB 3.9s ease-in-out infinite;
}

body.home .datmit-signal-19 {
    left: 74%;
    top: 52%;
    animation: datmitSignalFastA 3.6s ease-in-out infinite;
}

body.home .datmit-signal-20 {
    left: 88%;
    top: 47%;
    animation: datmitSignalFastB 4.1s ease-in-out infinite;
}

body.home .datmit-signal-21 {
    left: 31%;
    top: 69%;
    animation: datmitSignalFastA 3.4s ease-in-out infinite;
}

body.home .datmit-signal-22 {
    left: 47%;
    top: 77%;
    animation: datmitSignalFastB 3.7s ease-in-out infinite;
}

body.home .datmit-signal-23 {
    left: 61%;
    top: 72%;
    animation: datmitSignalFastA 4s ease-in-out infinite;
}

body.home .datmit-signal-24 {
    left: 91%;
    top: 74%;
    animation: datmitSignalFastB 3.3s ease-in-out infinite;
}


/* movimento più rapido dei nodi */

@keyframes datmitSignalFastA {

    0%, 100% {
        transform: translate(0, 0);
    }

    25% {
        transform: translate(10px, -5px);
    }

    50% {
        transform: translate(18px, 4px);
    }

    75% {
        transform: translate(7px, 9px);
    }

}


@keyframes datmitSignalFastB {

    0%, 100% {
        transform: translate(0, 0);
    }

    25% {
        transform: translate(-8px, 7px);
    }

    50% {
        transform: translate(-16px, -3px);
    }

    75% {
        transform: translate(-5px, -9px);
    }

}


/* =========================================================
   FOOTER - COPYRIGHT / DATI SOCIETARI / PRIVACY
   ========================================================= */

.datmit-footer-bottom {
    display: grid !important;

    grid-template-columns:
        auto 1fr auto !important;

    align-items: center !important;

    column-gap: 30px !important;

    width: 100% !important;
}


.datmit-footer-company-data {
    justify-self: center;

    text-align: center;

    color: rgba(202,218,230,.72);

    font-size: 10px;
    line-height: 1.3;

    white-space: nowrap;
}


.datmit-footer-company-data span {
    margin: 0 7px;

    color: rgba(89,199,255,.55);
}


.datmit-footer-legal {
    justify-self: end;
}


/* =========================================================
   DESKTOP MEDIO
   ========================================================= */

@media (max-width: 1450px) {

    body.home .datmit-brand {
        width: 310px !important;
        max-width: 310px !important;
        flex-basis: 310px !important;
    }

    body.home .datmit-logo-light {
        width: 295px !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .datmit-footer-bottom {
        grid-template-columns: 1fr !important;
        row-gap: 7px !important;
    }

    .datmit-footer-company-data,
    .datmit-footer-legal {
        justify-self: start !important;
        text-align: left !important;
    }

    .datmit-footer-company-data {
        white-space: normal;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    body.home .datmit-hero h1,
    body.home .datmit-hero-title {
        font-size: clamp(38px, 11vw, 52px) !important;
    }

    body.home .datmit-fiber-11,
    body.home .datmit-fiber-12,
    body.home .datmit-fiber-13,
    body.home .datmit-fiber-14 {
        display: none;
    }

}



/* =========================================================
   DATMIT HOME LIVE MODE
   Home pubblica - navigazione interna temporaneamente disabilitata
   ========================================================= */


/* Nasconde navigazione desktop */

body.home .datmit-nav {
    display: none !important;
}


/* Nasconde menu mobile / hamburger */

body.home .datmit-menu-toggle,
body.home .datmit-mobile-menu {
    display: none !important;
}


/* Nasconde Remote Support */

body.home .datmit-client-area,
body.home .datmit-support {
    display: none !important;
}


/* Logo visibile ma non cliccabile */

body.home .datmit-brand {
    pointer-events: none !important;
    cursor: default !important;
}


/* Hero: nasconde i due pulsanti */

body.home .datmit-hero-actions {
    display: none !important;
}


/*
 * Le card rimangono visibili perché sono importanti
 * per raccontare le divisioni DatMit,
 * ma non sono cliccabili.
 */

body.home .datmit-home-card {
    pointer-events: none !important;
    cursor: default !important;
}


/* Nasconde "Scopri..." dalle card */

body.home .datmit-card-link {
    display: none !important;
}


/* Footer: nasconde navigazione */

body.home .datmit-footer-columns {
    display: none !important;
}


/*
 * Privacy e Cookie restano momentaneamente non cliccabili
 * finché le relative pagine non saranno completate.
 */

body.home .datmit-footer-legal a {
    pointer-events: none !important;
    cursor: default !important;
    opacity: .55;
}


/*
 * Disabilitazione di sicurezza di qualsiasi altro link
 * eventualmente presente nella Home.
 */

body.home main a {
    pointer-events: none !important;
    cursor: default !important;
}


/* =========================================================
   DATMIT HERO EARTH
   Sostituzione sfera centrale con globo tecnologico
   ========================================================= */

body.home .datmit-core.datmit-earth {
    position: absolute;
    right: 6%;
    bottom: 4%;
    width: clamp(220px, 24vw, 360px);
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background:
        radial-gradient(circle at center,
            rgba(120, 210, 255, 0.26) 0%,
            rgba(35, 130, 255, 0.18) 36%,
            rgba(0, 0, 0, 0) 72%
        ),
        url('../images/earth-network.png') center center / contain no-repeat;
    box-shadow:
        0 0 30px rgba(55, 170, 255, 0.28),
        0 0 60px rgba(55, 170, 255, 0.14);
    animation: datmitEarthFloat 7s ease-in-out infinite;
    z-index: 3;
    overflow: visible;
}

/* alone / orbite leggere attorno al globo */
body.home .datmit-core.datmit-earth::before,
body.home .datmit-core.datmit-earth::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

body.home .datmit-core.datmit-earth::before {
    inset: -10%;
    border: 1px solid rgba(140, 210, 255, 0.16);
    animation: datmitEarthSpin 24s linear infinite;
}

body.home .datmit-core.datmit-earth::after {
    inset: -24%;
    border: 1px solid rgba(140, 210, 255, 0.08);
    animation: datmitEarthSpin 36s linear infinite reverse;
}

@keyframes datmitEarthFloat {
    0%   { transform: translateY(0px); }
    50%  { transform: translateY(-8px); }
    100% { transform: translateY(0px); }
}

@keyframes datmitEarthSpin {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* responsive */
@media (max-width: 1200px) {
    body.home .datmit-core.datmit-earth {
        width: clamp(180px, 22vw, 280px);
        right: 4%;
        bottom: 4%;
    }
}

@media (max-width: 768px) {
    body.home .datmit-core.datmit-earth {
        width: clamp(140px, 34vw, 220px);
        right: 50%;
        transform: translateX(50%);
        bottom: 2%;
    }

    @keyframes datmitEarthFloat {
        0%   { transform: translateX(50%) translateY(0px); }
        50%  { transform: translateX(50%) translateY(-6px); }
        100% { transform: translateX(50%) translateY(0px); }
    }
}



/* =========================================================
   DATMIT HOME FINAL TUNING - OCTOBER 2026
   ========================================================= */


/* ---------------------------------------------------------
   LOGO PIÙ IMPORTANTE
   --------------------------------------------------------- */

body.home .datmit-brand {
    width: 400px !important;
    max-width: 400px !important;
    flex: 0 0 400px !important;
}

body.home .datmit-logo-light {
    display: block !important;
    width: 380px !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
}

body.home .datmit-logo-dark {
    display: none !important;
}


/* ---------------------------------------------------------
   HERO: TITOLO LEGGERMENTE PIÙ PICCOLO
   --------------------------------------------------------- */

body.home .datmit-hero h1,
body.home .datmit-hero-title {
    max-width: 760px !important;

    font-size: clamp(45px, 3.8vw, 59px) !important;
    line-height: .99 !important;

    letter-spacing: -.043em !important;

    margin-bottom: 24px !important;
}

body.home .datmit-hero-text {
    max-width: 760px !important;

    font-size: 15px !important;
    line-height: 1.55 !important;
}


/* ---------------------------------------------------------
   COMPETENZE DIVERSE / UN UNICO ECOSISTEMA
   --------------------------------------------------------- */

body.home .datmit-divisions-heading h2 {
    font-size: clamp(32px, 2.7vw, 46px) !important;
    line-height: 1 !important;
}


/* =========================================================
   FIBRE AGGIUNTIVE
   ========================================================= */

body.home .datmit-fiber {
    opacity: .92 !important;

    box-shadow:
        0 0 8px rgba(40,190,255,.25),
        0 0 20px rgba(40,190,255,.12) !important;
}


/* nuove fibre */

body.home .datmit-fiber-9 {
    width: 1080px;
    left: 3%;
    top: 20%;
    transform: rotate(7deg);
}

body.home .datmit-fiber-10 {
    width: 920px;
    left: 19%;
    top: 31%;
    transform: rotate(-11deg);
}

body.home .datmit-fiber-11 {
    width: 1120px;
    left: 2%;
    top: 43%;
    transform: rotate(13deg);
}

body.home .datmit-fiber-12 {
    width: 980px;
    left: 29%;
    top: 53%;
    transform: rotate(-9deg);
}

body.home .datmit-fiber-13 {
    width: 1180px;
    left: 4%;
    top: 65%;
    transform: rotate(8deg);
}

body.home .datmit-fiber-14 {
    width: 860px;
    left: 48%;
    top: 18%;
    transform: rotate(15deg);
}

body.home .datmit-fiber-15 {
    width: 1050px;
    left: 1%;
    top: 76%;
    transform: rotate(-5deg);
}

body.home .datmit-fiber-16 {
    width: 720px;
    left: 58%;
    top: 38%;
    transform: rotate(-18deg);
}

body.home .datmit-fiber-17 {
    width: 930px;
    left: 34%;
    top: 83%;
    transform: rotate(7deg);
}

body.home .datmit-fiber-18 {
    width: 780px;
    left: 8%;
    top: 57%;
    transform: rotate(-16deg);
}


/* =========================================================
   SEGNALI CHE SCORRONO SULLE FIBRE
   ========================================================= */

body.home .datmit-fiber::before {
    animation-duration: 2.6s !important;
}

body.home .datmit-fiber::after {
    animation-duration: 3.3s !important;
}


/* sfalsamento per evitare movimenti sincronizzati */

body.home .datmit-fiber:nth-of-type(2n)::before {
    animation-delay: -1.1s !important;
}

body.home .datmit-fiber:nth-of-type(3n)::after {
    animation-delay: -1.8s !important;
}

body.home .datmit-fiber:nth-of-type(5n)::before {
    animation-delay: -2.2s !important;
}


/* =========================================================
   NUOVI PUNTI LUMINOSI
   ========================================================= */

body.home .datmit-signal-13,
body.home .datmit-signal-17,
body.home .datmit-signal-21,
body.home .datmit-signal-25,
body.home .datmit-signal-29 {
    width: 8px;
    height: 8px;

    background: #37d7ff;

    box-shadow:
        0 0 9px #37d7ff,
        0 0 21px rgba(55,215,255,.52);
}


body.home .datmit-signal-14,
body.home .datmit-signal-18,
body.home .datmit-signal-22,
body.home .datmit-signal-26,
body.home .datmit-signal-30 {
    width: 8px;
    height: 8px;

    background: #ff922e;

    box-shadow:
        0 0 9px #ff922e,
        0 0 22px rgba(255,146,46,.48);
}


body.home .datmit-signal-15,
body.home .datmit-signal-19,
body.home .datmit-signal-23,
body.home .datmit-signal-27,
body.home .datmit-signal-31 {
    width: 7px;
    height: 7px;

    background: #ff5058;

    box-shadow:
        0 0 9px #ff5058,
        0 0 21px rgba(255,80,88,.48);
}


body.home .datmit-signal-16,
body.home .datmit-signal-20,
body.home .datmit-signal-24,
body.home .datmit-signal-28,
body.home .datmit-signal-32 {
    width: 7px;
    height: 7px;

    background: #ffffff;

    box-shadow:
        0 0 9px rgba(255,255,255,.95),
        0 0 20px rgba(255,255,255,.42);
}


/* posizioni dei nuovi nodi */

body.home .datmit-signal-13 { left: 19%; top: 18%; }
body.home .datmit-signal-14 { left: 31%; top: 25%; }
body.home .datmit-signal-15 { left: 43%; top: 19%; }
body.home .datmit-signal-16 { left: 55%; top: 28%; }

body.home .datmit-signal-17 { left: 68%; top: 17%; }
body.home .datmit-signal-18 { left: 81%; top: 25%; }
body.home .datmit-signal-19 { left: 90%; top: 35%; }
body.home .datmit-signal-20 { left: 74%; top: 41%; }

body.home .datmit-signal-21 { left: 23%; top: 50%; }
body.home .datmit-signal-22 { left: 38%; top: 58%; }
body.home .datmit-signal-23 { left: 53%; top: 51%; }
body.home .datmit-signal-24 { left: 63%; top: 62%; }

body.home .datmit-signal-25 { left: 79%; top: 57%; }
body.home .datmit-signal-26 { left: 88%; top: 68%; }
body.home .datmit-signal-27 { left: 71%; top: 72%; }
body.home .datmit-signal-28 { left: 58%; top: 78%; }

body.home .datmit-signal-29 { left: 41%; top: 76%; }
body.home .datmit-signal-30 { left: 28%; top: 83%; }
body.home .datmit-signal-31 { left: 15%; top: 72%; }
body.home .datmit-signal-32 { left: 94%; top: 79%; }


/* movimento indipendente dei nodi */

body.home .datmit-signal {
    animation:
        datmitFastSignal 3.4s ease-in-out infinite alternate !important;
}

body.home .datmit-signal:nth-child(2n) {
    animation-duration: 2.7s !important;
}

body.home .datmit-signal:nth-child(3n) {
    animation-duration: 4.1s !important;
}

body.home .datmit-signal:nth-child(5n) {
    animation-delay: -1.7s !important;
}


@keyframes datmitFastSignal {

    0% {
        transform: translate3d(0,0,0);
    }

    35% {
        transform: translate3d(7px,-5px,0);
    }

    70% {
        transform: translate3d(-5px,6px,0);
    }

    100% {
        transform: translate3d(4px,-3px,0);
    }

}


/* =========================================================
   FOOTER DATI SOCIETARI
   ========================================================= */

.datmit-footer-bottom {
    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        auto minmax(0,1fr) auto !important;

    align-items: center !important;

    column-gap: 24px !important;
}


.datmit-footer-company-data {
    justify-self: center;

    font-size: 10px;
    line-height: 1.3;

    color: rgba(200,218,231,.72);

    white-space: nowrap;

    text-align: center;
}


.datmit-footer-company-data span {
    margin: 0 7px;

    color: rgba(48,184,255,.62);
}


.datmit-footer-legal {
    justify-self: end;
}


/* =========================================================
   DESKTOP MEDIO
   ========================================================= */

@media (max-width: 1450px) {

    body.home .datmit-brand {
        width: 330px !important;
        max-width: 330px !important;
        flex-basis: 330px !important;
    }

    body.home .datmit-logo-light {
        width: 315px !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .datmit-footer-bottom {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
    }

    .datmit-footer-company-data,
    .datmit-footer-legal {
        justify-self: start !important;
        text-align: left !important;
    }

    .datmit-footer-company-data {
        white-space: normal;
    }

}


/* =========================================================
   ACCESSIBILITÀ
   ========================================================= */

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

    body.home .datmit-signal,
    body.home .datmit-fiber::before,
    body.home .datmit-fiber::after {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT EARTH GLOBE - FINAL
   Globo grande, fisso nella posizione, rotazione continua
   ========================================================= */


/* neutralizza completamente la vecchia palla */

body.home .datmit-hero .datmit-core.datmit-earth {
    position: absolute !important;

    left: 76% !important;
    top: 62% !important;
    right: auto !important;
    bottom: auto !important;

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

    width: clamp(360px, 28vw, 520px) !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;

    min-width: 0 !important;
    min-height: 0 !important;

    display: block !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: none !important;
    background-image: none !important;

    box-shadow: none !important;

    overflow: visible !important;

    opacity: 1 !important;

    z-index: 4 !important;

    pointer-events: none !important;

    animation: none !important;
}


/* eliminiamo completamente i vecchi pseudo-elementi */

body.home .datmit-hero .datmit-core.datmit-earth::before,
body.home .datmit-hero .datmit-core.datmit-earth::after {
    content: none !important;
    display: none !important;
}


/* immagine vera e propria */

body.home .datmit-earth-globe {
    display: block !important;

    width: 100% !important;
    height: auto !important;

    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    border-radius: 50% !important;

    object-fit: contain !important;

    filter:
        drop-shadow(0 0 14px rgba(48,190,255,.50))
        drop-shadow(0 0 34px rgba(25,130,255,.24));

    transform-origin: center center !important;

    animation:
        datmitEarthRotate 26s linear infinite !important;
}


/*
 * Rotazione continua.
 * Il contenitore resta fermo:
 * ruota solo il globo.
 */

@keyframes datmitEarthRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   ORBITA ESTERNA MOLTO LEGGERA
   ========================================================= */

body.home .datmit-earth {
    outline:
        1px solid rgba(70,190,255,.08);
}


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

@media (max-width: 1450px) {

    body.home .datmit-hero .datmit-core.datmit-earth {
        left: 77% !important;
        top: 64% !important;

        width: clamp(320px, 27vw, 450px) !important;
    }

}


@media (max-width: 1100px) {

    body.home .datmit-hero .datmit-core.datmit-earth {
        left: 78% !important;
        top: 68% !important;

        width: 320px !important;
    }

}


@media (max-width: 760px) {

    body.home .datmit-hero .datmit-core.datmit-earth {
        left: 72% !important;
        top: 75% !important;

        width: 240px !important;
    }

}


/* rispetto impostazione sistema */

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

    body.home .datmit-earth-globe {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT EARTH - STOP FLAT ROTATION
   La rotazione naturale sarà gestita dall'asset animato
   ========================================================= */

body.home .datmit-earth-globe {
    animation: none !important;
    transform: none !important;
}



/* =========================================================
   DATMIT EARTH - ANIMATED ASSET
   L'animazione è contenuta nel GIF/WebP
   ========================================================= */

body.home .datmit-earth-globe {
    animation: none !important;
    transform: none !important;

    display: block !important;

    width: 100% !important;
    height: auto !important;

    max-width: none !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 50% !important;

    object-fit: contain !important;

    filter:
        drop-shadow(0 0 16px rgba(50,190,255,.48))
        drop-shadow(0 0 38px rgba(30,130,255,.22));
}


/* Globo grande nello spazio centrale-destro */

body.home .datmit-hero .datmit-core.datmit-earth {
    left: 75% !important;
    top: 62% !important;

    right: auto !important;
    bottom: auto !important;

    width: clamp(420px, 31vw, 590px) !important;

    height: auto !important;
    aspect-ratio: 1 / 1 !important;

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

    background: none !important;

    border: 0 !important;
    box-shadow: none !important;

    overflow: visible !important;

    z-index: 3 !important;
}


/* nessun vecchio effetto bianco */

body.home .datmit-core.datmit-earth::before,
body.home .datmit-core.datmit-earth::after {
    content: none !important;
    display: none !important;
}


/* Desktop medio */

@media (max-width: 1450px) {

    body.home .datmit-hero .datmit-core.datmit-earth {
        left: 76% !important;
        top: 64% !important;

        width: clamp(360px, 29vw, 500px) !important;
    }

}


/* Tablet */

@media (max-width: 1100px) {

    body.home .datmit-hero .datmit-core.datmit-earth {
        width: 340px !important;
    }

}



/* =========================================================
   DATMIT EARTH VIDEO FINAL
   ========================================================= */

body.home .datmit-core.datmit-earth {
    position: absolute !important;

    left: 72% !important;
    top: 66% !important;

    right: auto !important;
    bottom: auto !important;

    width: clamp(380px, 30vw, 560px) !important;
    aspect-ratio: 1 / 1 !important;

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

    animation: none !important;
    transition: none !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    overflow: visible !important;

    z-index: 4 !important;

    pointer-events: none !important;
}

body.home .datmit-core.datmit-earth::before,
body.home .datmit-core.datmit-earth::after {
    content: none !important;
    display: none !important;
}

body.home .datmit-earth-video {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: contain !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 50% !important;

    transform: none !important;
    animation: none !important;
    transition: none !important;

    filter:
        drop-shadow(0 0 16px rgba(55,190,255,.45))
        drop-shadow(0 0 38px rgba(30,120,255,.22));
}

/* nasconde eventuale vecchia immagine */
body.home .datmit-earth-globe {
    display: none !important;
}


/* =========================================================
   DATMIT HERO BRAIN
   Immagine fissa cervello/profilo AI con segnali che scorrono
   verso sinistra e si integrano con le fibre del background
   ========================================================= */

body.home .datmit-core.datmit-brain {
    position: absolute;
    right: 7%;
    top: 52%;
    transform: translateY(-42%);
    width: clamp(360px, 30vw, 560px);
    aspect-ratio: 1 / 1;
    background: transparent !important;
    border: 0 !important;
    border-radius: 50%;
    box-shadow: none !important;
    overflow: visible !important;
    pointer-events: none;
    z-index: 1;
}

body.home .datmit-core.datmit-brain::before,
body.home .datmit-core.datmit-brain::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

body.home .datmit-core.datmit-brain::before {
    inset: -6%;
    border-radius: 50%;
    background:
        radial-gradient(circle at center,
            rgba(55,190,255,0.22) 0%,
            rgba(55,190,255,0.10) 32%,
            rgba(55,190,255,0.00) 72%);
    filter: blur(14px);
    z-index: 0;
}

body.home .datmit-brain-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    background: transparent !important;
    mix-blend-mode: screen;
    filter:
        drop-shadow(0 0 16px rgba(46,185,255,0.35))
        drop-shadow(0 0 36px rgba(46,185,255,0.18));
    z-index: 2;
}

/* linee luminose che escono dal cervello verso sinistra */
body.home .datmit-brain-signal {
    position: absolute;
    height: 2px;
    border-radius: 999px;
    transform-origin: right center;
    pointer-events: none;
    overflow: visible;
    opacity: 0.78;
    z-index: 1;
    background:
        linear-gradient(90deg,
            rgba(62,193,255,0.00) 0%,
            rgba(62,193,255,0.12) 18%,
            rgba(62,193,255,0.35) 50%,
            rgba(62,193,255,0.95) 100%);
    box-shadow:
        0 0 10px rgba(62,193,255,0.20),
        0 0 20px rgba(62,193,255,0.10);
    animation: datmitBrainLineGlow 3.8s ease-in-out infinite;
    animation-delay: var(--delay);
}

body.home .datmit-brain-signal::after {
    content: "";
    position: absolute;
    right: -5px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    transform: translateY(-50%);
    background: var(--dot, #4bd8ff);
    box-shadow:
        0 0 8px var(--dot, #4bd8ff),
        0 0 16px var(--dot, #4bd8ff),
        0 0 24px rgba(255,255,255,0.18);
    animation: datmitBrainDot var(--dur, 2.6s) linear infinite;
    animation-delay: var(--delay, 0s);
}

/* disposizione dei segnali */
body.home .datmit-brain-signal.sig-1 {
    width: 760px;
    top: 23%;
    right: 56%;
    transform: rotate(-18deg);
    --dur: 2.5s;
    --delay: 0s;
    --dot: #4bd8ff;
}

body.home .datmit-brain-signal.sig-2 {
    width: 690px;
    top: 33%;
    right: 59%;
    transform: rotate(-8deg);
    --dur: 2.2s;
    --delay: 0.45s;
    --dot: #ff9b2f;
}

body.home .datmit-brain-signal.sig-3 {
    width: 720px;
    top: 44%;
    right: 60%;
    transform: rotate(2deg);
    --dur: 2.9s;
    --delay: 0.2s;
    --dot: #ffffff;
}

body.home .datmit-brain-signal.sig-4 {
    width: 800px;
    top: 54%;
    right: 58%;
    transform: rotate(10deg);
    --dur: 3s;
    --delay: 0.8s;
    --dot: #4bd8ff;
}

body.home .datmit-brain-signal.sig-5 {
    width: 690px;
    top: 66%;
    right: 56%;
    transform: rotate(18deg);
    --dur: 2.4s;
    --delay: 0.35s;
    --dot: #ff5a57;
}

body.home .datmit-brain-signal.sig-6 {
    width: 610px;
    top: 78%;
    right: 52%;
    transform: rotate(26deg);
    --dur: 2.7s;
    --delay: 1s;
    --dot: #4bd8ff;
}

@keyframes datmitBrainDot {
    0% {
        right: -5px;
        opacity: 0;
        transform: translateY(-50%) scale(0.55);
    }
    8% {
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    100% {
        right: calc(100% - 5px);
        opacity: 0;
        transform: translateY(-50%) scale(1);
    }
}

@keyframes datmitBrainLineGlow {
    0%, 100% {
        opacity: 0.45;
    }
    50% {
        opacity: 0.9;
    }
}

/* un po' più piccolo su schermi medi */
@media (max-width: 1400px) {
    body.home .datmit-core.datmit-brain {
        width: clamp(320px, 28vw, 480px);
        right: 6%;
    }
}

/* su mobile/narrow: nascondi il cervello per non rompere il layout */
@media (max-width: 980px) {
    body.home .datmit-core.datmit-brain {
        display: none;
    }
}


/* =========================================================
   DATMIT HERO BRAIN - CLEAN FINAL
   ========================================================= */


/* ---------------------------------------------------------
   ELIMINA DEFINITIVAMENTE TERRA / VIDEO PRECEDENTI
   --------------------------------------------------------- */

body.home .datmit-earth,
body.home .datmit-earth-video,
body.home .datmit-earth-globe {
    display: none !important;
}


/* ---------------------------------------------------------
   CONTENITORE AI
   --------------------------------------------------------- */

body.home .datmit-hero .datmit-core.datmit-brain {
    position: absolute !important;

    left: 75% !important;
    top: 57% !important;

    right: auto !important;
    bottom: auto !important;

    width: clamp(390px, 31vw, 570px) !important;
    height: clamp(390px, 31vw, 570px) !important;

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

    min-width: 0 !important;
    min-height: 0 !important;

    display: block !important;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 0 !important;

    outline: 0 !important;

    box-shadow: none !important;

    overflow: visible !important;

    opacity: 1 !important;

    animation: none !important;
    transition: none !important;

    pointer-events: none !important;

    z-index: 3 !important;
}


/* nessun residuo vecchio */

body.home .datmit-core.datmit-brain::before,
body.home .datmit-core.datmit-brain::after {
    content: none !important;
    display: none !important;
}


/* ---------------------------------------------------------
   IMMAGINE BRAIN
   --------------------------------------------------------- */

body.home .datmit-brain-image {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    display: block !important;

    object-fit: contain !important;
    object-position: center center !important;

    max-width: none !important;

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    transform: none !important;
    animation: none !important;
    transition: none !important;

    filter:
        drop-shadow(0 0 18px rgba(52,188,255,.25))
        drop-shadow(0 0 36px rgba(40,115,255,.12));

    z-index: 3 !important;
}


/* ---------------------------------------------------------
   CONNESSIONI VERSO SINISTRA
   --------------------------------------------------------- */

body.home .datmit-brain-connections {
    position: absolute;

    inset: 0;

    overflow: visible;

    z-index: 2;

    pointer-events: none;
}


body.home .datmit-brain-line {
    position: absolute;

    right: 72%;

    height: 1px;

    width: var(--length);

    transform-origin: right center;

    transform: rotate(var(--angle));

    background:
        linear-gradient(
            90deg,
            rgba(46,190,255,0) 0%,
            rgba(46,190,255,.12) 32%,
            rgba(46,190,255,.42) 75%,
            rgba(80,210,255,.85) 100%
        );

    box-shadow:
        0 0 5px rgba(60,200,255,.18);

    opacity: .85;
}


/*
 * Il punto luminoso viaggia DAL CERVELLO VERSO SINISTRA.
 */

body.home .datmit-brain-line i {
    position: absolute;

    right: -4px;
    top: 50%;

    width: var(--size, 8px);
    height: var(--size, 8px);

    border-radius: 50%;

    transform: translateY(-50%);

    background: var(--color);

    box-shadow:
        0 0 7px var(--color),
        0 0 14px var(--color),
        0 0 25px rgba(55,190,255,.22);

    animation:
        datmitBrainDataFlow var(--speed) linear infinite;

    animation-delay:
        var(--delay);
}


@keyframes datmitBrainDataFlow {

    0% {
        right: -4px;

        opacity: 0;

        transform:
            translateY(-50%)
            scale(.45);
    }

    7% {
        opacity: 1;
    }

    85% {
        opacity: 1;
    }

    100% {
        right: calc(100% - 4px);

        opacity: 0;

        transform:
            translateY(-50%)
            scale(1.05);
    }

}


/* ---------------------------------------------------------
   POSIZIONAMENTO DELLE 8 FIBRE
   --------------------------------------------------------- */

body.home .datmit-brain-line.line-1 {
    top: 22%;
    --length: 760px;
    --angle: -18deg;
    --speed: 2.15s;
    --delay: -.3s;
    --color: #48d8ff;
}

body.home .datmit-brain-line.line-2 {
    top: 31%;
    --length: 710px;
    --angle: -10deg;
    --speed: 2.55s;
    --delay: -1.1s;
    --color: #ff9633;
}

body.home .datmit-brain-line.line-3 {
    top: 39%;
    --length: 820px;
    --angle: -4deg;
    --speed: 2.35s;
    --delay: -.7s;
    --color: #48d8ff;
}

body.home .datmit-brain-line.line-4 {
    top: 47%;
    --length: 760px;
    --angle: 3deg;
    --speed: 2.75s;
    --delay: -1.8s;
    --color: #ffffff;
}

body.home .datmit-brain-line.line-5 {
    top: 55%;
    --length: 830px;
    --angle: 9deg;
    --speed: 2.25s;
    --delay: -1.4s;
    --color: #48d8ff;
}

body.home .datmit-brain-line.line-6 {
    top: 63%;
    --length: 740px;
    --angle: 15deg;
    --speed: 2.65s;
    --delay: -.5s;
    --color: #ff565b;
}

body.home .datmit-brain-line.line-7 {
    top: 71%;
    --length: 690px;
    --angle: 21deg;
    --speed: 2.30s;
    --delay: -1.6s;
    --color: #ff9633;
}

body.home .datmit-brain-line.line-8 {
    top: 78%;
    --length: 620px;
    --angle: 27deg;
    --speed: 2.85s;
    --delay: -.9s;
    --color: #48d8ff;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1450px) {

    body.home .datmit-hero .datmit-core.datmit-brain {
        left: 76% !important;
        top: 59% !important;

        width: 470px !important;
        height: 470px !important;
    }

}


@media (max-width: 1100px) {

    body.home .datmit-hero .datmit-core.datmit-brain {
        left: 78% !important;

        width: 360px !important;
        height: 360px !important;
    }

}


/* mobile: meglio non sovraccaricare */

@media (max-width: 850px) {

    body.home .datmit-core.datmit-brain {
        display: none !important;
    }

}


/* accessibilità */

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

    body.home .datmit-brain-line i {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT HERO CLEAN FIBER MODE
   Solo fibre + segnali luminosi
   ========================================================= */


/* sicurezza: nasconde eventuali vecchi elementi residui */

body.home .datmit-core,
body.home .datmit-earth,
body.home .datmit-earth-video,
body.home .datmit-earth-globe,
body.home .datmit-brain,
body.home .datmit-brain-image,
body.home .datmit-brain-connections,
body.home .datmit-brain-signal {
    display: none !important;
}


/* Hero */

body.home .datmit-hero {
    position: relative !important;
    overflow: hidden !important;
}


/* =========================================================
   NUOVO LIVELLO FIBRE
   ========================================================= */

body.home .datmit-hero::before {
    content: "";

    position: absolute;
    inset: -8%;

    pointer-events: none;

    z-index: 1;

    background:
        linear-gradient(
            8deg,
            transparent 12%,
            rgba(68,196,255,0) 20%,
            rgba(68,196,255,.20) 20.4%,
            rgba(68,196,255,0) 20.8%,
            transparent 32%
        ),

        linear-gradient(
            -10deg,
            transparent 20%,
            rgba(68,196,255,0) 34%,
            rgba(68,196,255,.24) 34.4%,
            rgba(68,196,255,0) 34.8%,
            transparent 50%
        ),

        linear-gradient(
            14deg,
            transparent 29%,
            rgba(81,211,255,0) 46%,
            rgba(81,211,255,.18) 46.4%,
            rgba(81,211,255,0) 46.8%,
            transparent 66%
        ),

        linear-gradient(
            -6deg,
            transparent 39%,
            rgba(75,200,255,0) 58%,
            rgba(75,200,255,.22) 58.4%,
            rgba(75,200,255,0) 58.8%,
            transparent 74%
        ),

        linear-gradient(
            11deg,
            transparent 48%,
            rgba(92,211,255,0) 66%,
            rgba(92,211,255,.16) 66.4%,
            rgba(92,211,255,0) 66.8%,
            transparent 83%
        ),

        linear-gradient(
            -14deg,
            transparent 56%,
            rgba(60,181,255,0) 73%,
            rgba(60,181,255,.20) 73.4%,
            rgba(60,181,255,0) 73.8%,
            transparent 88%
        );

    opacity: .95;

    animation:
        datmitFiberLayerMove 11s linear infinite;
}


/* =========================================================
   SEGNALI LUMINOSI
   ========================================================= */

body.home .datmit-hero::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        radial-gradient(circle at 10% 18%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 16% 42%, #ff9b31 0 3px, transparent 4px),
        radial-gradient(circle at 21% 70%, #ff575f 0 3px, transparent 4px),

        radial-gradient(circle at 27% 25%, #ffffff 0 3px, transparent 4px),
        radial-gradient(circle at 32% 55%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 38% 81%, #ff9b31 0 3px, transparent 4px),

        radial-gradient(circle at 44% 15%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 49% 46%, #ff575f 0 3px, transparent 4px),
        radial-gradient(circle at 53% 73%, #ffffff 0 3px, transparent 4px),

        radial-gradient(circle at 59% 28%, #ff9b31 0 3px, transparent 4px),
        radial-gradient(circle at 63% 58%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 67% 84%, #ff575f 0 3px, transparent 4px),

        radial-gradient(circle at 72% 19%, #ffffff 0 3px, transparent 4px),
        radial-gradient(circle at 76% 44%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 81% 69%, #ff9b31 0 3px, transparent 4px),

        radial-gradient(circle at 87% 25%, #ff575f 0 3px, transparent 4px),
        radial-gradient(circle at 91% 52%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 95% 77%, #ffffff 0 3px, transparent 4px),

        radial-gradient(circle at 14% 88%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 35% 90%, #ff9b31 0 3px, transparent 4px),
        radial-gradient(circle at 57% 91%, #40d6ff 0 4px, transparent 5px),
        radial-gradient(circle at 79% 89%, #ff575f 0 3px, transparent 4px);

    filter:
        drop-shadow(0 0 6px rgba(55,205,255,.68));

    opacity: .95;

    animation:
        datmitSignalLayerMove 5.2s ease-in-out infinite alternate;
}


/* contenuto sopra le fibre */

body.home .datmit-hero-inner {
    position: relative !important;
    z-index: 3 !important;
}


/* =========================================================
   ANIMAZIONI
   ========================================================= */

@keyframes datmitFiberLayerMove {

    0% {
        transform:
            translate3d(0,0,0)
            scale(1);
    }

    50% {
        transform:
            translate3d(-1.4%,.8%,0)
            scale(1.015);
    }

    100% {
        transform:
            translate3d(-2.8%,1.6%,0)
            scale(1.03);
    }

}


@keyframes datmitSignalLayerMove {

    0% {
        transform: translate3d(0,0,0);
        opacity: .86;
    }

    50% {
        transform: translate3d(-10px,5px,0);
        opacity: 1;
    }

    100% {
        transform: translate3d(-20px,9px,0);
        opacity: .90;
    }

}


/* =========================================================
   RINFORZO FIBRE HTML GIÀ ESISTENTI
   ========================================================= */

body.home .datmit-fiber {
    opacity: .92 !important;

    box-shadow:
        0 0 8px rgba(55,198,255,.24),
        0 0 18px rgba(55,198,255,.12) !important;
}


body.home .datmit-fiber::before {
    animation-duration: 2.5s !important;
}


body.home .datmit-fiber::after {
    animation-duration: 3.1s !important;
}


/* =========================================================
   PUNTI HTML GIÀ ESISTENTI
   ========================================================= */

body.home .datmit-signal {
    animation-duration: 3.1s !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 850px) {

    body.home .datmit-hero::before {
        opacity: .65;
    }

    body.home .datmit-hero::after {
        opacity: .70;
    }

}


/* =========================================================
   ACCESSIBILITÀ
   ========================================================= */

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

    body.home .datmit-hero::before,
    body.home .datmit-hero::after,
    body.home .datmit-fiber::before,
    body.home .datmit-fiber::after,
    body.home .datmit-signal {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT PARTNER TECHNOLOGY STRIP
   ========================================================= */

body.home .datmit-partners {
    position: relative;

    width: 100%;

    background:
        linear-gradient(
            180deg,
            #061522 0%,
            #071827 100%
        );

    overflow: hidden;
}


/* ---------------------------------------------------------
   LINEE LUMINOSE
   --------------------------------------------------------- */

body.home .datmit-partners-line {
    width: 100%;
    height: 4px;

    background-size: 300% 100%;
}


body.home .datmit-partners-line-top {
    background:
        linear-gradient(
            90deg,
            #1aa7ff 0%,
            #36d9ff 45%,
            #1aa7ff 100%
        );

    box-shadow:
        0 0 10px rgba(53,210,255,.45),
        0 0 22px rgba(53,210,255,.18);
}


body.home .datmit-partners-line-bottom {
    background:
        linear-gradient(
            90deg,
            #34d4ff 0%,
            #168fff 28%,
            #875cff 52%,
            #e84bbf 72%,
            #ff8c38 88%,
            #34d4ff 100%
        );

    background-size: 300% 100%;

    box-shadow:
        0 0 11px rgba(80,188,255,.35),
        0 0 20px rgba(145,76,255,.16);

    animation:
        datmitPartnerLineFlow 8s linear infinite;
}


@keyframes datmitPartnerLineFlow {

    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 300% 50%;
    }

}


/* ---------------------------------------------------------
   CONTENITORE
   --------------------------------------------------------- */

body.home .datmit-partners-inner {
    max-width: 1500px;

    margin: 0 auto;

    padding:
        24px
        32px
        26px;
}


/* ---------------------------------------------------------
   TITOLO
   --------------------------------------------------------- */

body.home .datmit-partners-label {
    margin:
        0
        0
        20px;

    color:
        rgba(166,195,216,.85);

    font-size: 12px;

    font-weight: 700;

    letter-spacing: .18em;

    text-transform: uppercase;

    text-align: center;
}


/* ---------------------------------------------------------
   GRIGLIA LOGHI
   --------------------------------------------------------- */

body.home .datmit-partners-grid {
    display: grid;

    grid-template-columns:
        repeat(6, minmax(0, 1fr));

    align-items: center;

    gap: 22px;
}


/* ---------------------------------------------------------
   ITEM
   --------------------------------------------------------- */

body.home .datmit-partner-item {
    min-height: 64px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding:
        8px
        14px;

    border-left:
        1px solid rgba(103,154,190,.16);
}


body.home .datmit-partner-item:first-child {
    border-left: 0;
}


/* ---------------------------------------------------------
   LOGHI
   --------------------------------------------------------- */

body.home .datmit-partner-item img {
    display: block;

    max-width: 160px;

    max-height: 42px;

    width: auto;

    height: auto;

    object-fit: contain;

    filter:
        grayscale(1)
        brightness(1.85)
        contrast(.9);

    opacity: .82;

    transition:
        transform .25s ease,
        filter .25s ease,
        opacity .25s ease;
}


/*
 * Hover:
 * torna il colore originale del logo.
 */

body.home .datmit-partner-item:hover img {
    filter:
        grayscale(0)
        brightness(1)
        contrast(1);

    opacity: 1;

    transform:
        translateY(-2px)
        scale(1.04);
}


/* ---------------------------------------------------------
   LEGGERO GLOW DI SFONDO
   --------------------------------------------------------- */

body.home .datmit-partners::before {
    content: "";

    position: absolute;

    left: 50%;
    top: 50%;

    width: 70%;
    height: 100%;

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

    background:
        radial-gradient(
            ellipse at center,
            rgba(30,150,255,.08) 0%,
            rgba(30,150,255,0) 70%
        );

    pointer-events: none;
}


/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media (max-width: 1100px) {

    body.home .datmit-partners-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));

        row-gap: 20px;
    }

    body.home .datmit-partner-item:nth-child(4) {
        border-left: 0;
    }

}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 650px) {

    body.home .datmit-partners-inner {
        padding:
            20px
            18px
            22px;
    }

    body.home .datmit-partners-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 18px;
    }

    body.home .datmit-partner-item {
        border-left: 0;

        min-height: 54px;
    }

    body.home .datmit-partner-item img {
        max-width: 125px;
        max-height: 34px;
    }

}


/* ---------------------------------------------------------
   ACCESSIBILITÀ
   --------------------------------------------------------- */

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

    body.home .datmit-partners-line-bottom {
        animation: none !important;
    }

    body.home .datmit-partner-item img {
        transition: none !important;
    }

}



/* =========================================================
   DATMIT PARTNERS - VISIBILITY + SYNCED GLOW
   ========================================================= */


/* ---------------------------------------------------------
   LOGHI SEMPRE VISIBILI
   --------------------------------------------------------- */

body.home .datmit-partner-item img {
    filter:
        grayscale(.15)
        brightness(1.35)
        contrast(1.05) !important;

    opacity: .95 !important;

    transition:
        transform .25s ease,
        filter .25s ease,
        opacity .25s ease !important;
}


/* hover: colore pieno e leggermente più luminoso */

body.home .datmit-partner-item:hover img {
    filter:
        grayscale(0)
        brightness(1.05)
        contrast(1.05) !important;

    opacity: 1 !important;

    transform:
        translateY(-2px)
        scale(1.04);
}


/* ---------------------------------------------------------
   GRADIENTE COMUNE PER TUTTE LE LINEE
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom,
body.home .datmit-footer::before {
    background:
        linear-gradient(
            90deg,
            #30d7ff 0%,
            #178cff 22%,
            #7c5cff 42%,
            #d84fc2 60%,
            #ff596d 76%,
            #ff9338 90%,
            #30d7ff 100%
        ) !important;

    background-size:
        320% 100% !important;

    animation:
        datmitUnifiedGlow 8s linear infinite !important;
}


/* ---------------------------------------------------------
   STESSA VELOCITÀ E STESSA FASE
   --------------------------------------------------------- */

@keyframes datmitUnifiedGlow {

    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 320% 50%;
    }

}


/* ---------------------------------------------------------
   GLOW DIFFERENZIATO MA SINCRONIZZATO
   --------------------------------------------------------- */

body.home .datmit-partners-line-top {
    box-shadow:
        0 0 9px rgba(55,205,255,.38),
        0 0 20px rgba(55,205,255,.16) !important;
}


body.home .datmit-partners-line-bottom {
    box-shadow:
        0 0 10px rgba(120,100,255,.32),
        0 0 22px rgba(220,80,190,.16) !important;
}


body.home .datmit-footer::before {
    box-shadow:
        0 0 10px rgba(255,110,90,.30),
        0 0 22px rgba(255,145,50,.14) !important;
}


/* ---------------------------------------------------------
   ACCESSIBILITÀ
   --------------------------------------------------------- */

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

    body.home .datmit-partners-line-top,
    body.home .datmit-partners-line-bottom,
    body.home .datmit-footer::before {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT PARTNERS - BIGGER LOGOS + ACTIVE COLOR LINES
   ========================================================= */


/* ---------------------------------------------------------
   LOGHI PIU GRANDI
   --------------------------------------------------------- */

body.home .datmit-partner-item {
    min-height: 92px !important;

    padding:
        10px
        20px !important;
}


body.home .datmit-partner-item img {
    max-width: 220px !important;
    max-height: 64px !important;

    width: auto !important;
    height: auto !important;

    opacity: 1 !important;

    filter:
        grayscale(0)
        brightness(1)
        contrast(1) !important;

    transform: none !important;
}


/* Dell e HP possono essere leggermente più grandi */

body.home .datmit-partner-item:nth-child(3) img,
body.home .datmit-partner-item:nth-child(4) img {
    max-height: 72px !important;
}


/* FiberCop / OpenFiber */

body.home .datmit-partner-item:nth-child(1) img,
body.home .datmit-partner-item:nth-child(2) img {
    max-width: 200px !important;
}


/* Microsoft / WatchGuard */

body.home .datmit-partner-item:nth-child(5) img,
body.home .datmit-partner-item:nth-child(6) img {
    max-width: 240px !important;
}


/* ---------------------------------------------------------
   LINEE COLORATE - ANIMAZIONE VISIBILE
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom,
body.home .datmit-footer::before {
    background:
        linear-gradient(
            90deg,
            #22d8ff 0%,
            #168dff 15%,
            #4f67ff 30%,
            #915cff 45%,
            #d54fc3 60%,
            #ff5577 75%,
            #ff9638 90%,
            #22d8ff 100%
        ) !important;

    background-size:
        180% 100% !important;

    animation:
        datmitUnifiedGlowFast 5.5s linear infinite !important;
}


/*
 * Movimento più evidente:
 * la texture compie realmente un ciclo completo.
 */

@keyframes datmitUnifiedGlowFast {

    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 180% 50%;
    }

}


/* ---------------------------------------------------------
   GLOW
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom {
    height: 5px !important;

    box-shadow:
        0 0 10px rgba(60,205,255,.38),
        0 0 20px rgba(120,90,255,.18) !important;
}


body.home .datmit-footer::before {
    height: 5px !important;
}


/* ---------------------------------------------------------
   SPACING PARTNER
   --------------------------------------------------------- */

body.home .datmit-partners-inner {
    padding:
        26px
        32px
        30px !important;
}


body.home .datmit-partners-grid {
    gap: 28px !important;
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1100px) {

    body.home .datmit-partner-item img {
        max-width: 180px !important;
        max-height: 56px !important;
    }

}


@media (max-width: 650px) {

    body.home .datmit-partner-item img {
        max-width: 145px !important;
        max-height: 46px !important;
    }

}


/* ---------------------------------------------------------
   ACCESSIBILITA
   --------------------------------------------------------- */

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

    body.home .datmit-partners-line-top,
    body.home .datmit-partners-line-bottom,
    body.home .datmit-footer::before {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT PARTNERS - FINAL SIZE + MOVING COLOR BARS
   ========================================================= */


/* ---------------------------------------------------------
   DIMENSIONE LOGHI PIÙ EQUILIBRATA
   --------------------------------------------------------- */

body.home .datmit-partner-item img {
    max-height: 58px !important;
    max-width: 190px !important;
}


/* FiberCop */
body.home .datmit-partner-item:nth-child(1) img {
    max-width: 180px !important;
}


/* Open Fiber */
body.home .datmit-partner-item:nth-child(2) img {
    max-width: 205px !important;
}


/* Dell */
body.home .datmit-partner-item:nth-child(3) img {
    max-height: 64px !important;
    max-width: 125px !important;
}


/* HP */
body.home .datmit-partner-item:nth-child(4) img {
    max-height: 66px !important;
    max-width: 105px !important;
}


/* Microsoft */
body.home .datmit-partner-item:nth-child(5) img {
    max-height: 50px !important;
    max-width: 185px !important;
}


/* WatchGuard */
body.home .datmit-partner-item:nth-child(6) img {
    max-height: 48px !important;
    max-width: 175px !important;
}


/* ---------------------------------------------------------
   LINEE: MOVIMENTO COLORE REALMENTE VISIBILE
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom,
body.home .datmit-footer::before {

    background:
        linear-gradient(
            90deg,
            #27d8ff 0%,
            #178eff 12%,
            #4b67ff 24%,
            #8b5cff 36%,
            #c64fd1 48%,
            #ff4f98 60%,
            #ff5d62 72%,
            #ff9638 84%,
            #27d8ff 100%
        ) !important;

    background-size: 220% 100% !important;

    animation:
        datmitColorSweep 6s ease-in-out infinite alternate !important;
}


/* il gradiente va avanti e indietro */
@keyframes datmitColorSweep {

    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 100% 50%;
    }

}


/* ---------------------------------------------------------
   STESSA FASE SU TUTTE LE TRE LINEE
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom,
body.home .datmit-footer::before {
    animation-delay: 0s !important;
}


/* ---------------------------------------------------------
   ALTEZZA LINEE
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom,
body.home .datmit-footer::before {
    height: 4px !important;
}


/* ---------------------------------------------------------
   GLOW PIÙ DISCRETO
   --------------------------------------------------------- */

body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom {
    box-shadow:
        0 0 8px rgba(60,205,255,.28),
        0 0 16px rgba(140,90,255,.12) !important;
}


/* ---------------------------------------------------------
   ACCESSIBILITÀ
   --------------------------------------------------------- */

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

    body.home .datmit-partners-line-top,
    body.home .datmit-partners-line-bottom,
    body.home .datmit-footer::before {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT FOOTER - READABILITY TUNING
   ========================================================= */

.datmit-footer-bottom {
    padding-top: 18px !important;
    padding-bottom: 18px !important;

    min-height: 56px !important;

    align-items: center !important;
}


/* Copyright */

.datmit-footer-bottom > *:first-child,
.datmit-footer-bottom .datmit-footer-copyright {
    font-size: 13px !important;
    line-height: 1.4 !important;

    color: rgba(215,228,238,.80) !important;
}


/* Dati societari centrali */

.datmit-footer-company-data {
    font-size: 13px !important;
    line-height: 1.4 !important;

    color: rgba(215,228,238,.82) !important;

    font-weight: 400 !important;
}


/* separatori */

.datmit-footer-company-data span {
    margin: 0 9px !important;

    color: rgba(63,198,255,.78) !important;
}


/* Privacy / Cookie */

.datmit-footer-legal,
.datmit-footer-legal a {
    font-size: 13px !important;
    line-height: 1.4 !important;

    color: rgba(215,228,238,.78) !important;

    opacity: 1 !important;
}


/* Hover discreto */

.datmit-footer-legal a:hover {
    color: #ffffff !important;
}


/* linea superiore leggermente più visibile */

.datmit-footer-bottom {
    border-top-color: rgba(105,150,180,.30) !important;
}


/* Mobile */

@media (max-width: 800px) {

    .datmit-footer-company-data,
    .datmit-footer-legal,
    .datmit-footer-bottom > *:first-child {
        font-size: 12px !important;
    }

}



/* =========================================================
   DATMIT COLOR LINES - REAL MOVEMENT FIX
   Movimento reale del gradiente tramite pseudo-elemento
   ========================================================= */


/* Le tre linee diventano contenitori */
body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom,
body.home .datmit-footer::before {
    position: relative !important;
    overflow: hidden !important;

    background: #0a1a28 !important;

    animation: none !important;
}


/* Linee partner */
body.home .datmit-partners-line-top::before,
body.home .datmit-partners-line-bottom::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;

    left: -100%;

    width: 300%;

    background:
        linear-gradient(
            90deg,
            #26d9ff 0%,
            #178eff 12%,
            #4f67ff 24%,
            #8e5cff 36%,
            #c950cf 48%,
            #ff4f9a 60%,
            #ff5868 72%,
            #ff9638 84%,
            #26d9ff 100%
        );

    animation:
        datmitRealColorMove 8s linear infinite;

    will-change: transform;
}


/* Footer: pseudo-elemento separato */
body.home .datmit-footer {
    position: relative !important;
}

body.home .datmit-footer::before {
    content: "";

    position: absolute !important;

    left: 0 !important;
    right: 0 !important;
    top: 0 !important;

    height: 4px !important;

    overflow: hidden !important;

    background: transparent !important;
}

body.home .datmit-footer::after {
    content: "";

    position: absolute;

    left: -100%;
    top: 0;

    width: 300%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #26d9ff 0%,
            #178eff 12%,
            #4f67ff 24%,
            #8e5cff 36%,
            #c950cf 48%,
            #ff4f9a 60%,
            #ff5868 72%,
            #ff9638 84%,
            #26d9ff 100%
        );

    animation:
        datmitRealColorMove 8s linear infinite;

    will-change: transform;

    pointer-events: none;
}


/* Movimento continuo, stessa fase */
@keyframes datmitRealColorMove {

    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(33.333%);
    }

}


/* glow */
body.home .datmit-partners-line-top,
body.home .datmit-partners-line-bottom {
    height: 4px !important;

    box-shadow:
        0 0 8px rgba(60,205,255,.35),
        0 0 18px rgba(140,90,255,.16) !important;
}


/* Per rendere la sincronizzazione identica */
body.home .datmit-partners-line-top::before,
body.home .datmit-partners-line-bottom::before,
body.home .datmit-footer::after {
    animation-delay: 0s !important;
    animation-duration: 8s !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
}


/* Se il sistema chiede reduced motion, qui NON blocchiamo queste linee */
@media (prefers-reduced-motion: reduce) {

    body.home .datmit-partners-line-top::before,
    body.home .datmit-partners-line-bottom::before,
    body.home .datmit-footer::after {
        animation:
            datmitRealColorMove 12s linear infinite !important;
    }

}



/* =========================================================
   DATMIT FOOTER COLOR LINE - RESTORE
   Ripristino terza linea animata sincronizzata
   ========================================================= */

body.home .datmit-footer {
    position: relative !important;
    overflow: hidden !important;
}


/*
 * Usiamo ::before esclusivamente come barra animata
 * sopra al footer.
 */

body.home .datmit-footer::before {
    content: "" !important;

    display: block !important;

    position: absolute !important;

    left: -100% !important;
    top: 0 !important;

    width: 300% !important;
    height: 4px !important;

    background:
        linear-gradient(
            90deg,
            #26d9ff 0%,
            #178eff 12%,
            #4f67ff 24%,
            #8e5cff 36%,
            #c950cf 48%,
            #ff4f9a 60%,
            #ff5868 72%,
            #ff9638 84%,
            #26d9ff 100%
        ) !important;

    animation:
        datmitRealColorMove 8s linear infinite !important;

    animation-delay: 0s !important;

    z-index: 20 !important;

    pointer-events: none !important;

    box-shadow:
        0 0 8px rgba(60,205,255,.35),
        0 0 18px rgba(140,90,255,.16) !important;

    will-change: transform;
}


/*
 * Disattiviamo il vecchio ::after del footer
 * per evitare due barre sovrapposte.
 */

body.home .datmit-footer::after {
    content: none !important;
    display: none !important;
}


/* stessa animazione usata dalle altre linee */

@keyframes datmitRealColorMove {

    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(33.333%);
    }

}


/* anche con reduced-motion manteniamo un movimento lento */

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

    body.home .datmit-footer::before {
        animation:
            datmitRealColorMove 12s linear infinite !important;
    }

}



/* =========================================================
   DATMIT PARTNERS - TEXT ONLY
   ========================================================= */

body.home .datmit-partner-item {
    min-height: 78px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 10px 18px !important;
}

body.home .datmit-partner-name {
    display: inline-block;

    font-size: clamp(18px, 1.45vw, 24px);

    line-height: 1.2;

    font-weight: 600;

    letter-spacing: .01em;

    color: rgba(232,241,248,.92);

    text-align: center;

    white-space: nowrap;

    transition:
        color .25s ease,
        transform .25s ease,
        text-shadow .25s ease;
}

body.home .datmit-partner-item:hover .datmit-partner-name {
    color: #ffffff;

    transform: translateY(-1px);

    text-shadow:
        0 0 10px rgba(55,205,255,.34);
}

/* divisori verticali un po' più discreti */

body.home .datmit-partner-item {
    border-left:
        1px solid rgba(100,155,190,.16) !important;
}

body.home .datmit-partner-item:first-child {
    border-left: 0 !important;
}

/* mobile */

@media (max-width: 900px) {

    body.home .datmit-partner-name {
        font-size: 17px;
    }

}

@media (max-width: 650px) {

    body.home .datmit-partner-name {
        font-size: 16px;
    }

}



/* =========================================================
   DATMIT PARTNERS - TEXT VISIBILITY FIX
   ========================================================= */

body.home .datmit-partner-item {
    color: #eaf4fb !important;
    opacity: 1 !important;
}

body.home .datmit-partner-name {
    display: inline-block !important;

    color: #eaf4fb !important;

    opacity: 1 !important;

    font-size: 22px !important;
    line-height: 1.2 !important;

    font-weight: 600 !important;

    letter-spacing: .01em !important;

    text-align: center !important;

    text-shadow:
        0 0 8px rgba(55,205,255,.16) !important;

    filter: none !important;

    mix-blend-mode: normal !important;

    visibility: visible !important;
}


/* leggero effetto hover */

body.home .datmit-partner-item:hover .datmit-partner-name {
    color: #ffffff !important;

    text-shadow:
        0 0 8px rgba(55,205,255,.45),
        0 0 18px rgba(55,205,255,.18) !important;

    transform: translateY(-1px) !important;
}


/* mobile */

@media (max-width: 900px) {

    body.home .datmit-partner-name {
        font-size: 18px !important;
    }

}



/* =========================================================
   DATMIT PUBLIC DEVELOPMENT MODE
   Menu statico + avviso sito in sviluppo
   ========================================================= */


/* ---------------------------------------------------------
   MENU VISIBILE MA NON CLICCABILE
   --------------------------------------------------------- */

body.home .datmit-nav-static {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: clamp(24px, 2.4vw, 42px) !important;
}

body.home .datmit-nav-static span {
    display: inline-block;

    color: rgba(238,245,250,.92);

    font-size: 18px;
    font-weight: 500;
    line-height: 1;

    white-space: nowrap;

    cursor: default;
    user-select: none;

    transition:
        color .2s ease,
        text-shadow .2s ease;
}

/* piccolo effetto visivo, ma resta NON cliccabile */

body.home .datmit-nav-static span:hover {
    color: #ffffff;

    text-shadow:
        0 0 10px rgba(48,200,255,.25);
}


/* ---------------------------------------------------------
   WEBSITE UNDER DEVELOPMENT
   --------------------------------------------------------- */

body.home .datmit-development-notice {
    position: relative;

    width: 100%;
    min-height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    padding: 9px 24px;

    background:
        linear-gradient(
            90deg,
            rgba(5,20,33,.98) 0%,
            rgba(8,36,58,.98) 50%,
            rgba(5,20,33,.98) 100%
        );

    border-top:
        1px solid rgba(63,190,255,.18);

    border-bottom:
        1px solid rgba(63,190,255,.28);

    color: #dcecf7;

    font-size: 12px;
    line-height: 1.2;

    letter-spacing: .035em;

    z-index: 10;
}

body.home .datmit-development-notice strong {
    color: #ffffff;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .16em;

    text-transform: uppercase;
}

body.home .datmit-development-text {
    color: rgba(196,216,230,.78);

    letter-spacing: .02em;
}


/* punto luminoso */

body.home .datmit-development-dot {
    width: 8px;
    height: 8px;

    flex: 0 0 8px;

    border-radius: 50%;

    background: #38d6ff;

    box-shadow:
        0 0 7px #38d6ff,
        0 0 16px rgba(56,214,255,.65);

    animation:
        datmitDevelopmentPulse 1.8s ease-in-out infinite;
}

@keyframes datmitDevelopmentPulse {

    0%,
    100% {
        opacity: .55;
        transform: scale(.82);
    }

    50% {
        opacity: 1;
        transform: scale(1);
    }

}


/* sottile linea luminosa sotto la fascia */

body.home .datmit-development-notice::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: -1px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #29d8ff 25%,
            #417cff 50%,
            #b15cff 72%,
            transparent 100%
        );

    opacity: .70;
}


/* ---------------------------------------------------------
   TABLET / MOBILE
   --------------------------------------------------------- */

@media (max-width: 900px) {

    body.home .datmit-nav-static {
        display: none !important;
    }

    body.home .datmit-development-notice {
        flex-wrap: wrap;

        gap: 5px 9px;

        padding: 9px 16px;

        text-align: center;
    }

    body.home .datmit-development-text {
        width: 100%;
    }

}


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

    body.home .datmit-development-dot {
        animation: none !important;
    }

}



/* =========================================================
   DATMIT WEBSITE UNDER DEVELOPMENT - FINAL FIX
   ========================================================= */

body.home .datmit-development-notice {
    position: relative !important;

    width: 100% !important;
    height: auto !important;
    min-height: 42px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 12px !important;

    padding: 10px 24px !important;
    margin: 0 !important;

    overflow: visible !important;

    background:
        linear-gradient(
            90deg,
            #06131f 0%,
            #08243a 50%,
            #06131f 100%
        ) !important;

    color: #ffffff !important;

    opacity: 1 !important;
    visibility: visible !important;

    font-size: 13px !important;
    line-height: 1.4 !important;

    z-index: 100 !important;

    border: 0 !important;
}


/* titolo */

body.home .datmit-development-notice strong {
    display: inline-block !important;

    color: #ffffff !important;

    opacity: 1 !important;
    visibility: visible !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    line-height: 1.4 !important;

    letter-spacing: .15em !important;

    text-transform: uppercase !important;

    text-shadow:
        0 0 10px rgba(55,210,255,.20) !important;
}


/* testo secondario */

body.home .datmit-development-notice .datmit-development-text {
    display: inline-block !important;

    color: rgba(210,228,240,.88) !important;

    opacity: 1 !important;
    visibility: visible !important;

    font-size: 12px !important;

    line-height: 1.4 !important;
}


/* punto luminoso */

body.home .datmit-development-notice .datmit-development-dot {
    display: inline-block !important;

    width: 8px !important;
    height: 8px !important;

    flex: 0 0 8px !important;

    border-radius: 50% !important;

    background: #35d7ff !important;

    opacity: 1 !important;

    box-shadow:
        0 0 7px #35d7ff,
        0 0 16px rgba(53,215,255,.65) !important;

    animation:
        datmitDevelopmentPulseFinal 1.7s ease-in-out infinite !important;
}


@keyframes datmitDevelopmentPulseFinal {

    0%,
    100% {
        opacity: .55;
        transform: scale(.8);
    }

    50% {
        opacity: 1;
        transform: scale(1.15);
    }

}


/* linea luminosa inferiore */

body.home .datmit-development-notice::after {
    content: "" !important;

    display: block !important;

    position: absolute !important;

    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #29d8ff 20%,
            #338fff 42%,
            #8c5cff 63%,
            #d850c4 80%,
            transparent 100%
        ) !important;

    opacity: .85 !important;
}


/* mobile */

@media (max-width: 850px) {

    body.home .datmit-development-notice {
        flex-wrap: wrap !important;

        padding: 9px 14px !important;

        text-align: center !important;
    }

    body.home .datmit-development-notice .datmit-development-text {
        width: 100% !important;
    }

}



/* =========================================================
   DATMIT DEVELOPMENT BANNER - DEFINITIVE
   ========================================================= */

.datmit-development-notice {
    box-sizing: border-box !important;

    width: 100% !important;
    min-height: 46px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 12px !important;

    margin: 0 !important;
    padding: 10px 20px !important;

    position: relative !important;

    background: #071b2b !important;

    color: #ffffff !important;

    font-family: inherit !important;

    visibility: visible !important;
    opacity: 1 !important;

    overflow: visible !important;

    z-index: 999 !important;
}


.datmit-development-notice strong {
    display: inline-block !important;

    color: #ffffff !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    letter-spacing: .17em !important;

    visibility: visible !important;
    opacity: 1 !important;
}


.datmit-development-text {
    display: inline-block !important;

    color: #aac4d7 !important;

    font-size: 13px !important;

    visibility: visible !important;
    opacity: 1 !important;
}


.datmit-development-dot {
    display: block !important;

    width: 9px !important;
    height: 9px !important;

    flex: 0 0 9px !important;

    border-radius: 50% !important;

    background: #31d5ff !important;

    box-shadow:
        0 0 8px #31d5ff,
        0 0 18px rgba(49,213,255,.65) !important;

    animation: datmitDevPulse 1.5s ease-in-out infinite !important;
}


@keyframes datmitDevPulse {

    0%,
    100% {
        opacity: .45;
        transform: scale(.8);
    }

    50% {
        opacity: 1;
        transform: scale(1.15);
    }

}


/* linea colorata sotto */
.datmit-development-notice::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            #26d9ff,
            #238bff,
            #805cff,
            #d44fc2,
            #ff5c66,
            #ff9638
        ) !important;
}


@media (max-width: 800px) {

    .datmit-development-notice {
        flex-wrap: wrap !important;
        text-align: center !important;
    }

    .datmit-development-text {
        width: 100% !important;
    }

}



/* =========================================================
   DATMIT DEVELOPMENT MODE - DISABLED LINKS
   ========================================================= */

body.home .datmit-disabled-link {
    cursor: default !important;
    text-decoration: none !important;
}

/* Manteniamo l'aspetto dei pulsanti */

body.home .datmit-button-primary.datmit-disabled-link,
body.home .datmit-button-secondary.datmit-disabled-link,
body.home .datmit-client-area.datmit-disabled-link,
body.home .datmit-support.datmit-disabled-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* Le card mantengono identica struttura */

body.home .datmit-home-card.datmit-disabled-link {
    display: flex !important;
    cursor: default !important;
}


/* niente comportamento da link */

body.home .datmit-disabled-link:hover {
    text-decoration: none !important;
}


/* Piccolo segnale visivo solo sui CTA */

body.home .datmit-button-primary.datmit-disabled-link,
body.home .datmit-button-secondary.datmit-disabled-link,
body.home .datmit-client-area.datmit-disabled-link,
body.home .datmit-support.datmit-disabled-link {
    opacity: .78;
}


/* Le card restano normali */

body.home .datmit-home-card.datmit-disabled-link {
    opacity: 1 !important;
}