* { margin:0; padding: 0; box-sizing: border-box; } body{ font-family: 'Inter', sans-serif; color:#000000; } .page-header{ background: #000000; display: flex; justify-content: center; padding: 28px 0; } .header-logo{ display: block; } .main-banner{ width: 100%; display: block; } .top-infocard{ display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 80px 0 96px; gap: 73px; } .top-infocard-text{ max-width:40%; } .top-infocard-subtitle{ font-weight: 400; font-size: 32px; text-transform: uppercase; } .top-infocard-title{ margin-bottom: 28px; font-weight: 500; font-size: 48px; text-transform: uppercase; } .top-infocard-description{ font-size: 16px; line-height: 24px; } .top-infocard-subtitle, .top-infocard-title{ text-align: center; } .figure-infocard{ width: 16%; } .top-infocard-image{ min-width: 100%; } /* BREAKPOINTS */ @media screen and (max-width:1024px) { .main-banner-desktop{ display: none; } .top-infocard{ gap:65px; } .top-infocard-text{ max-width:86%; } .top-infocard-subtitle{ font-size: 20px; } .top-infocard-title{ font-size: 28px; } .top-infocard-description{ text-align: center; } .figure-infocard{ display: flex; width: 58%; } .top-infocard-image{ margin: 0 auto; min-width: 0; } } @media screen and (min-width:1025px){ .main-banner-mobile{ display: none; } } @media screen and (min-width:2500px){ .top-infocard-subtitle{ font-size: 64px; } .top-infocard-title{ font-size: 96px; } .top-infocard-description{ font-size: 32px; line-height: 48px; } }