.marketing-layout-container {
    container-type: inline-size;
}

@scope (.marketing-layout-container) {
    .layout {
        display: flex;
        justify-content: center;
        align-items: center;
        width: min(1200px, 96vw);
        padding: 40px 0;
        margin: calc(var(--wa-space-4xl) * 0.5) auto;
        overflow: hidden;
        gap: 0.125rem;
        transform: translateX(-3%);
    }

    .squares {
        display: flex;
        width: 25%;
        justify-content: flex-end;
    }

    .phones {
        display: flex;
        gap: 0.125rem;
        width: 65%;
        justify-content: flex-start;
    }

    .item {
        flex: 1;
    }

    .image {
        width: 100%;
        height: auto;
        display: block;
        border-radius: 20px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        transition: transform 0.3s ease;
    }

    .shadow-1 { box-shadow: 0 10px 30px rgba(14, 56, 211, 0.5); }
    .shadow-2 { box-shadow: 0 10px 30px rgba(23,79,200,0.63); }
    .shadow-3 { box-shadow: 0 10px 30px rgba(35,63,204,0.43); }
    .shadow-4 { box-shadow: 0 10px 30px rgba(23,158,158,0.51); }
    .shadow-5 { box-shadow: 0 10px 30px rgba(25, 153, 191, 0.6); }

    .image:hover {
        transform: translateY(-5px);
    }

}

@media (max-width: 767px) {
    .marketing-layout-container {
        display: none;
    }
}