* {margin:0px; padding:0px; box-sizing:border-box}

:root {--color-primary-accent: #3a8bff;}


body {
background:#ffffff;
padding: 0 20px 56px;
line-height: 1.5;
}


#top-panel {
margin:0px auto;
width:100%;
max-width: 900px;
}


#main-panel {
width:100%;
padding-top: clamp(44px, 8vw, 130px);
padding-left: clamp(0px, 3vw, 72px);
padding-right: clamp(0px, 2vw, 24px);
}


#main-panel .logo-text {
color: #000835;
font-family: 'Quicksand', Helvetica, Arial, sans-serif;
font-weight: 500;
font-size: clamp(36px, 8.2vw, 56px);
letter-spacing: -0.02em;
margin-bottom: 16px}


#main-panel h2 {
color: #3a8bff; 
font-family: 'Manrope', Helvetica, Arial, Sans-serif; letter-spacing: -0.07em; 
font-size: clamp(26px, 5.8vw, 34px); 
margin-top: 14px}


#main-panel h3 {
color: #000835;
font-family: Helvetica, Arial, Sans-serif;
letter-spacing: -0.03em;
font-size: clamp(22px, 4.8vw, 28px);
margin-top: 24px}


#main-panel p {
color: #000835;
font-family: 'Myriad Pro', Helvetica, Arial, sans-serif;
margin-top: 20px;
font-size: clamp(17px, 3.4vw, 20px);
}

#main-panel p a {
color: #000835;
text-decoration-line: underline;
text-decoration-color: rgba(0, 8, 53, 0.35);
text-decoration-thickness: 1px;
text-underline-offset: 2px;
transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

#main-panel p a:hover {
color: var(--color-primary-accent);
text-decoration-color: rgba(58, 139, 255, 0.55);
}

@media (max-width: 640px) {
body {
padding-left: 16px;
padding-right: 16px;
}

#main-panel {
padding-top: 36px;
}

#main-panel .logo-text {
line-height: 1.08;
margin-bottom: 12px;
}

#main-panel h2 {
line-height: 1.12;
letter-spacing: -0.04em;
}

#main-panel h3 {
margin-top: 22px;
line-height: 1.2;
}

#main-panel p {
margin-top: 16px;
line-height: 1.55;
}
}