/* Company pages share Marcus's wordmark, glass navigation, type and footer. */
@font-face {
  font-family: 'Apple Garamond';
  src: url('/instructors/marcus/apple-garamond.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

html { scroll-padding-top: 118px; }
.company-page { --company-serif: 'Apple Garamond', Garamond, Georgia, serif; }
.company-page .skip { position: fixed; z-index: 100; }
.company-page main { background: #fff; color: #111; }
.company-page main:focus { outline: none; }
.company-page .nav.solid.company-nav {
  z-index: 80;
  gap: 20px;
  padding: 22px var(--pad);
  background: rgba(0, 0, 0, .16);
  color: #fff;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  box-shadow: 0 0 4px #00000014, 0 2px 4px #0000001a;
  transition: color .25s ease;
}
.company-page .company-nav.is-on-light { color: #111; }
.company-page .company-nav .logo { color: inherit; }
.company-page .company-nav .logo svg { height: 16px; width: auto; }
.company-page .company-nav nav { display: flex; gap: 30px; font-size: 14px; margin-right: 16px; }
.company-page .company-nav nav a { color: inherit; opacity: .88; }
.company-page .company-nav nav a:hover { opacity: 1; }
.company-page .company-nav .btn {
  min-height: 42px;
  border: 1px solid #fff;
  border-radius: 8px;
  padding: 10px 15px;
  color: #000;
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.company-page .company-nav .btn:hover { opacity: .86; }
.company-page .company-nav a:focus-visible { outline: 2px solid #896a59; outline-offset: 4px; }
.company-page main :focus-visible { outline-color: #111; }
.company-page [aria-current="page"] { text-decoration: underline; text-underline-offset: 5px; }

.company-intro { padding: 172px var(--pad) 76px; background: #000; color: #fff; }
.company-intro-inner { max-width: 900px; margin-inline: auto; }
.company-intro .eyebrow { margin-bottom: 24px; color: #aaa; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.company-intro .eyebrow span { padding-inline: 6px; }
.company-intro h1 { font-family: var(--eqx); font-size: clamp(42px, 5.6vw, 76px); font-weight: 300; letter-spacing: -.025em; line-height: 1.05; text-wrap: balance; }
.company-intro .updated { margin-top: 22px; color: #aaa; font-size: 12px; }
.company-intro .lede { max-width: 780px; margin-top: 30px; color: #ddd; font-size: 18px; line-height: 1.7; }
.company-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 32px; padding: 25px var(--pad); border-bottom: 1px solid #ddd; font-size: 13px; }
.company-links a { padding-block: 6px; }
.company-links a:hover { text-decoration: underline; text-underline-offset: 5px; }
.legal-main { width: min(780px, calc(100% - 2 * var(--pad))); margin-inline: auto; padding: 76px 0 100px; }
.legal-section + .legal-section { margin-top: 40px; padding-top: 34px; border-top: 1px solid #ddd; }
.legal-section h2 { margin-bottom: 20px; font-family: var(--company-serif); font-size: 34px; font-weight: 400; letter-spacing: -.015em; line-height: 1.15; text-wrap: balance; }
.legal-section p, .legal-section li { font-size: 16px; line-height: 1.75; }
.legal-section p + p, .legal-section p + ul { margin-top: 18px; }
.legal-section ul { display: grid; gap: 12px; padding-left: 22px; margin-bottom: 0; }
.legal-section strong { font-weight: 600; }
.legal-section a { text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal-section a:hover { opacity: .7; }
.company-page .foot { background: #000; color: #fff; }

@media (max-width: 700px) {
  .company-page .nav.solid.company-nav { flex-wrap: wrap; row-gap: 14px; padding: 14px 22px; }
  .company-page .company-nav .btn { min-height: 39px; padding: 8px 11px; font-size: 11px; }
  .company-page .company-nav .logo svg { height: 13px; }
  .company-page .company-nav nav { order: 3; flex: 0 0 100%; justify-content: center; gap: clamp(24px, 8vw, 40px); margin: 0; font-size: 13px; }
  .company-intro { padding-top: 166px; padding-bottom: 48px; }
  .company-intro h1 { font-size: clamp(38px, 9vw, 54px); }
  .company-intro .lede { font-size: 16px; }
  .company-links { justify-content: flex-start; gap: 8px 24px; padding-block: 18px; }
  .legal-main { padding-block: 48px 68px; }
  .legal-section h2 { font-size: 29px; }
  .legal-section p, .legal-section li { font-size: 15px; }
  .legal-section + .legal-section { margin-top: 32px; padding-top: 28px; }
}
@media (max-width: 379px) {
  .company-page .nav.solid.company-nav { gap: 8px; row-gap: 14px; padding-right: 12px; padding-left: 12px; }
  .company-page .company-nav .logo { flex: 0 0 auto; }
  .company-page .company-nav .btn { flex: 0 0 auto; min-height: 36px; padding: 8px 7px; font-size: 10px; letter-spacing: -.01em; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .company-page .company-nav { transition: none; }
}
