Por un lado, flota .col2 a la izquierda y .col1 a la derecha. Luego tienes que ajustar los elementos de dentro (si sólo haces eso, se te quedan como has dicho tú, pegados en el centro). Dentro de .col2, tienes que flotar #superfish-1 a la izquierda (o quitarle el float, no creo que lo necesite). Y dentro de .col1, tienes que alinear la imagen del logo a la derecha, para esto basta con que le des a .col2 un text-align:right .
En resumen:
Código:
.section-1 .col1 {
float:right;
text-align:right;
[...]
}
.section-1 .col2 {
float:left;
[...]
}
#superfish-1 {
float:left; // o quitarle el float
[...]
}
Así debería quedar como quieres. Fíjate que las dos columnas llevan unos márgenes, si quieres que queden bien pegadas al borde se los tendrás que quitar.