SwiftUI: How to achieve top left alignment for vertical text?

How can I align the vertical text ?. Everything is just like I want but I would like the text to align on the top left just like this image.. The code :

import SwiftUI

struct LycéesRow: View {
    var lycée: Lycée
    
    var body: some View {
        ZStack(alignment: .topLeading) {
            
            lycée.image
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 365, height: 280)
                .clipped()
                .cornerRadius(15)
                .offset(y: -35)
            
            RoundedRectangle(cornerRadius: 15)
                .frame(width: 365, height: 280)
                .background(.ultraThinMaterial, in: RoundedRectangle(cornerRadius: 15))
                .offset(y: -35)
            
            lycée.image
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 355, height: 200)
                .clipped()
                .cornerRadius(15)
                .offset(x: 5)
                .offset(y: 39.8)
            
        
            VStack(spacing: 1) {
                
                Text(lycée.département + ", France")
                    .font(.system(size: 15, weight: .medium, design: .default))
                    .foregroundColor(.white)

                    .opacity(0.5)
                
                Text(lycée.nom)
                    .font(.system(size: 25, weight: .bold, design: .serif))
                    .foregroundColor(.white)
                    .padding([.top, .leading])
                
                Text(lycée.ville)
                    .font(.system(size: 10, weight: .light, design: .default))
                    .foregroundColor(.white)
                    .padding([.top, .leading])

                
            }.offset(y: -25)
            
            
        }
    }
}
    
    
    struct LycéesRow_Previews: PreviewProvider {
        static var previews: some View {
            Group {
                LycéesRow(lycée: lycées[0])
                LycéesRow(lycée: lycées[1])
            }
        }
    }

I tried padding, at first I aligned everything manually which was very annoying but it only worked with that specific example (Nevers) and with other schools, it didn't render well at all and wasn't in the top left.

answer is to add VStack(alignment: .leading, spacing: x) so it looks like this :

VStack(alignment: .leading, spacing: 1) {
    Text(lycée.département + ", France")
      .font(.system(size: 15, weight: .medium, design: .default))
      .foregroundColor(.white)
      .opacity(0.5)
                
   Text(lycée.nom)
      .font(.system(size: 25, weight: .bold, design: .serif))
      .foregroundColor(.white)
     
   Text(lycée.ville)
      .font(.system(size: 13, weight: .light, design: .default))
      .foregroundColor(.white)
}