@font-face { font-family: Sora; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/sora/sora-latin-600.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 100 700; font-display: swap; src: url("../fonts/ibm-plex-sans/ibm-plex-sans-latin-variable.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/ibm-plex-mono/ibm-plex-mono-latin-500.woff2") format("woff2"); }

.company-page { --company-navy: #071826; --company-blue: #0d2a3d; --company-soft: #f4f6f3; --company-teal: #1693a5; --company-orange: #f47721; --company-line: rgb(117 151 160 / 28%); margin: 0; overflow-x: hidden; background: var(--company-navy); color: #dce7e8; font-family: "IBM Plex Sans", sans-serif; }
.company-page .site-header { width: 100%; max-width: none; min-height: 74px; margin: 0; padding-inline: clamp(48px, 3.5vw, 64px); border-color: #37505d; background: var(--company-navy); color: #fff; }
.company-page .site-header nav { gap: clamp(28px, 2vw, 32px); }
.company-page .site-header a:focus-visible,
.company-page .site-header button:focus-visible,
.company a:focus-visible { outline: 3px solid var(--company-orange); outline-offset: 4px; }
.company h1,
.company h2 { margin-top: 0; color: #fff; font-family: Sora, sans-serif; font-weight: 600; letter-spacing: -.045em; }
.company p { margin-top: 0; color: #c9d8da; font-size: 1.05rem; line-height: 1.72; }
.company__hero,
.company__history,
.company__method,
.company__areas,
.company__principles,
.company__contact { padding-inline: clamp(72px, 9.5vw, 190px); }
.company__hero { display: grid; min-height: 610px; padding-top: clamp(5rem, 9vw, 8.5rem); padding-bottom: clamp(4.5rem, 8vw, 7rem); border-bottom: 1px solid var(--company-line); grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr); align-items: end; gap: clamp(4rem, 9vw, 9rem); }
.company__hero h1 { max-width: 12ch; margin-bottom: 1.7rem; font-size: clamp(3.4rem, 5.7vw, 6.4rem); line-height: .98; }
.company__hero p { max-width: 650px; margin-bottom: 0; font-size: clamp(1.05rem, 1.3vw, 1.25rem); }
.company__hero dl { margin: 0; border-top: 3px solid var(--company-orange); }
.company__hero dl div { display: grid; padding: 1rem 0; border-bottom: 1px solid var(--company-line); grid-template-columns: 7rem 1fr; gap: 1rem; }
.company__hero dt { color: #789aa4; font-family: "IBM Plex Mono", monospace; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; }
.company__hero dd { margin: 0; color: #fff; font-weight: 650; }
.company__history { display: grid; padding-top: clamp(4.5rem, 8vw, 7.5rem); padding-bottom: clamp(4.5rem, 8vw, 7.5rem); background: var(--company-soft); color: #102b35; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(3rem, 8vw, 8rem); }
.company__history h2 { max-width: 12ch; color: #102b35; font-size: clamp(2.4rem, 4vw, 4.4rem); line-height: 1.03; }
.company__history p { max-width: 66ch; color: #34515b; }
.company__method { padding-top: clamp(4.5rem, 7vw, 7rem); padding-bottom: clamp(4.5rem, 7vw, 7rem); background: var(--company-blue); }
.company__method header { display: grid; margin-bottom: 3rem; grid-template-columns: 1fr 1fr; gap: 3rem; }
.company__method h2,
.company__areas h2,
.company__principles h2,
.company__contact h2 { font-size: clamp(2.2rem, 3.7vw, 4rem); line-height: 1.05; }
.company__method header p { max-width: 54ch; }
.company__method ol { display: grid; margin: 0; padding: 0; border-top: 1px solid var(--company-line); list-style: none; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.company__method li { min-height: 180px; padding: 1.6rem 1.8rem 1.6rem 0; border-bottom: 1px solid var(--company-line); }
.company__method li:not(:nth-child(3n + 1)) { padding-left: 1.8rem; border-left: 1px solid var(--company-line); }
.company__method strong,
.company__method span { display: block; }
.company__method strong { margin-bottom: .7rem; color: #fff; font-size: 1.15rem; }
.company__method span { color: #afc4c8; line-height: 1.6; }
.company__areas { display: grid; padding-top: clamp(4rem, 7vw, 6.5rem); padding-bottom: clamp(4rem, 7vw, 6.5rem); border-bottom: 1px solid var(--company-line); grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(3rem, 8vw, 8rem); }
.company__areas > div p { max-width: 48ch; }
.company__areas ul,
.company__principles ul { margin: 0; padding: 0; list-style: none; }
.company__areas li { padding: 1rem 0; border-bottom: 1px solid var(--company-line); color: #fff; }
.company__areas li::before { display: inline-block; width: 1.6rem; color: var(--company-orange); content: "—"; }
.company__areas strong { font-size: 1.12rem; }
.company__areas span { display: block; margin: .55rem 0 0 1.6rem; color: #afc4c8; line-height: 1.6; }
.company__principles { padding-top: clamp(4rem, 7vw, 6.5rem); padding-bottom: clamp(4rem, 7vw, 6.5rem); }
.company__principles h2 { max-width: 14ch; margin-bottom: 3rem; }
.company__principles ul { display: grid; border-top: 1px solid var(--company-line); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.company__principles li { padding: 1.4rem 1.4rem 1.4rem 0; border-bottom: 1px solid var(--company-line); color: #dce7e8; }
.company__principles strong,
.company__principles span { display: block; }
.company__principles strong { margin-bottom: .55rem; color: #fff; font-size: 1.08rem; }
.company__principles span { color: #afc4c8; line-height: 1.6; }
.company__contact { display: grid; padding-top: clamp(4rem, 7vw, 6rem); padding-bottom: clamp(4rem, 7vw, 6rem); border-top: 4px solid var(--company-orange); background: var(--company-blue); grid-template-columns: minmax(0, 1fr) minmax(280px, .65fr); gap: clamp(3rem, 8vw, 8rem); }
.company__contact h2 { max-width: 14ch; }
.company__contact > div:last-child { display: grid; align-content: center; gap: 1rem; }
.company__contact a { display: inline-flex; min-height: 48px; padding: .7rem 0; align-items: center; border-bottom: 1px solid var(--company-line); color: #fff; font-weight: 700; text-decoration: none; }
.company__contact a:hover { color: #63c5ce; }

@media (max-width: 900px) {
  .company__hero,
  .company__history,
  .company__method header,
  .company__areas,
  .company__contact { grid-template-columns: 1fr; }
  .company__hero { min-height: auto; }
  .company__method ol,
  .company__principles ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .company__method li:not(:nth-child(3n + 1)) { padding-left: 0; border-left: 0; }
  .company__method li:nth-child(even),
  .company__principles li:nth-child(even) { padding-left: 1.5rem; border-left: 1px solid var(--company-line); }
}

@media (max-width: 760px) {
  .company-page .site-header { padding-inline: clamp(18px, 5vw, 24px); }
  .company-page .site-header nav { border-color: #37505d; background: var(--company-navy); color: #fff; }
  .company__hero,
  .company__history,
  .company__method,
  .company__areas,
  .company__principles,
  .company__contact { padding-right: clamp(18px, 5vw, 24px); padding-left: clamp(18px, 5vw, 24px); }
  .company__hero { padding-top: 4rem; padding-bottom: 4rem; gap: 3rem; }
  .company__hero h1 { font-size: clamp(2.75rem, 13vw, 4.2rem); }
  .company__method ol,
  .company__principles ul { grid-template-columns: 1fr; }
  .company__method li,
  .company__method li:nth-child(even),
  .company__principles li,
  .company__principles li:nth-child(even) { min-height: 0; padding: 1.25rem 0; border-left: 0; }
}
