@font-face { font-family: Raleway; src: url("assets/raleway.ttf") format("truetype"); font-style: normal; font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Work Sans"; src: url("assets/work-sans.ttf") format("truetype"); font-style: normal; font-weight: 100 900; font-display: swap; }
:root { --leadcon-background: #14356C; color-scheme: dark; }
* { box-sizing: border-box; }
html { background: var(--leadcon-background); }
body { margin: 0; background: var(--leadcon-background); color: #fff; font-family: Raleway, Arial, Helvetica, sans-serif; font-weight: 500; font-size: 12px; line-height: 1.8; min-height: 100svh; }
main, footer { width: min(100% - 48px, 1040px); margin-inline: auto; }
.brand { padding-top: 128px; text-align: center; }
h1 { margin: 0; line-height: 0; }
h1 img { display: block; width: min(506px, 100%); height: auto; margin-inline: auto; }
.tagline { margin: 46px 0 0; font-family: "Work Sans", Arial, sans-serif; font-size: 14px; }
.offices { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; width: min(100%, 590px); margin: 182px auto 0; }
.china { text-align: right; }
.latam { text-align: left; }
h2 { margin: 0 0 3px; font-size: inherit; font-weight: normal; text-decoration: underline; text-underline-offset: 2px; }
address { font-style: normal; }
address p { margin: 0; }
.contacts { display: flex; justify-content: inherit; gap: 10px; flex-wrap: wrap; }
.china .contacts { justify-content: flex-end; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible { outline: 2px solid #bde2f8; outline-offset: 4px; }
footer { padding: 90px 0 64px; text-align: center; }
.copyright { margin: 0; }
.legal { font-style: italic; margin: 50px auto 0; }
@media (max-width: 640px) {
  body { font-size: 14px; line-height: 1.9; }
  main, footer { width: calc(100% - 48px); }
  .brand { padding-top: 132px; }
  h1 img { width: calc(100% + 16px); max-width: none; margin-left: -8px; }
  .tagline { margin-top: 64px; font-size: clamp(13px, 3.5vw, 17px); }
  .offices { grid-template-columns: 1fr; gap: 76px; margin-top: 184px; }
  h2 { margin-bottom: 5px; }
  address p { margin-bottom: 3px; }
  .contacts { gap: 0 10px; }
  .contacts a[href^="tel:"] { text-decoration: underline; text-underline-offset: 3px; }
  footer { padding-top: 105px; padding-bottom: 50px; }
  .legal { margin-top: 60px; }
}
@media (max-width: 360px) {
  main, footer { width: calc(100% - 32px); }
  body { font-size: 13px; }
  .tagline { white-space: normal; }
  .contacts span { display: none; }
}
