/* Company page: the existing Danubis type, colours and restrained motion. */
.company-page { overflow: clip; }
.company-wrap { width: min(100% - 112px, 1328px); margin-inline: auto; }
.company-page h1, .company-page h2, .company-page h3 { font-weight: 500; letter-spacing: -.035em; text-wrap: balance; }
.company-page h2 { font-size: clamp(2rem, 3.35vw, 3.3rem); line-height: 1.16; }
.company-page a:focus-visible, .company-page summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
.company-about-hero { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr); align-items: start; gap: 38px; min-height: min(600px, calc(100svh - var(--header-h))); padding-block: clamp(48px, 6vw, 92px) 66px; }
.company-page-label { display: block; font: 11px/1.5 var(--mono); color: var(--accent); margin-bottom: 28px; }
.company-about-copy h1 { font-size: clamp(2.8rem, 4.25vw, 4.1rem); line-height: 1.09; max-width: 800px; }
.company-about-copy > p { color: var(--muted); font-size: 16px; line-height: 1.8; max-width: 520px; margin-top: 28px; text-wrap: pretty; }
.company-text-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 44px; font: 12px/1.5 var(--sans); }
.company-text-link span { color: var(--accent); transition: transform .2s ease; }
.company-text-link:hover { color: var(--accent); }
.company-text-link:hover span { transform: translate(2px, -2px); }
.company-about-copy > a { margin-top: 22px; }
.company-symbol { position: relative; width: 100%; aspect-ratio: 1; max-width: 440px; justify-self: end; }
.company-symbol canvas { display: block; width: 100%; height: 100%; opacity: 0; }
.company-symbol-fallback { position: absolute; width: 58%; height: auto; left: 21%; top: 14%; opacity: .25; }
.company-symbol.is-ready canvas { opacity: 1; }
.company-symbol.is-ready .company-symbol-fallback { display: none; }
.company-section { padding-block: clamp(82px, 8vw, 124px); scroll-margin-top: calc(var(--header-h) + 20px); }
.company-section-heading[id], .company-introduction[id] { scroll-margin-top: calc(var(--header-h) + 20px); }
.company-mission { border-top: 1px solid var(--rule); }
.company-introduction h2 { max-width: 900px; }
.company-mission-copy { max-width: 760px; margin-top: 32px; }
.company-mission-copy > p { color: var(--muted); font-size: 15px; line-height: 1.85; text-wrap: pretty; }
.company-mission-copy > p + p { margin-top: 20px; }
.company-mission-copy > a { margin-top: 18px; }
.company-expertise { margin-top: 68px; }
.company-expertise > h3 { font-size: 20px; line-height: 1.4; margin-bottom: 30px; }
.company-expertise dl > div, .company-principle-list > div { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; padding-block: 25px; border-top: 1px solid var(--rule); }
.company-expertise dt, .company-principle-list dt { font-size: 17px; line-height: 1.6; color: var(--fg); }
.company-expertise dd, .company-principle-list dd { font-size: 14px; line-height: 1.85; color: var(--muted); max-width: 640px; }
.company-team { border-block: 1px solid #253849; background: var(--surface-blue); }
.company-section-heading { max-width: 800px; margin-bottom: 52px; }
.company-section-heading > p { color: var(--muted); font-size: 15px; line-height: 1.85; max-width: 700px; margin-top: 26px; text-wrap: pretty; }
.company-founders { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px; }
.company-founder { display: grid; grid-template-columns: 144px minmax(0, 1fr); gap: 28px; align-items: start; }
.company-portrait { width: 144px; height: 144px; object-fit: cover; }
.company-founder h3 { font-size: 25px; line-height: 1.3; }
.company-founder-role { color: var(--accent); font: 11px/1.6 var(--mono); margin-top: 10px; }
.company-founder-bio { color: var(--muted); font-size: 13px; line-height: 1.85; margin-top: 22px; }
.company-background { margin-top: 24px; border-top: 1px solid #29313a; }
.company-background summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 48px; cursor: pointer; list-style: none; font: 11px/1.6 var(--sans); color: #c0c7cf; }
.company-background summary::-webkit-details-marker { display: none; }
.company-background summary span { color: var(--accent); font-size: 18px; transition: transform .2s ease; }
.company-background[open] summary span { transform: rotate(45deg); }
.company-background ul { padding-left: 16px; margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.company-background li + li { margin-top: 14px; }
.company-principles .company-section-heading { max-width: 960px; }
.company-principles h2 { max-width: 850px; }
.company-principle-list > div { scroll-margin-top: calc(var(--header-h) + 20px); }
.company-contact { border-top: 1px solid #253849; background: var(--surface-blue); }
.company-contact h2 { max-width: 900px; }
.company-contact p { max-width: 650px; color: var(--muted); font-size: 15px; line-height: 1.85; margin-top: 27px; }
.company-contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; margin-top: 34px; }
.company-contact-actions .btn-primary { min-height: 46px; font-size: 12px; white-space: nowrap; }
@media (max-width: 1100px) {
  .company-wrap { width: calc(100% - 72px); }
  .company-about-hero { grid-template-columns: minmax(0, 1.5fr) minmax(220px, 1fr); gap: 20px; }
  .company-about-copy h1 { font-size: clamp(2.7rem, 4.6vw, 3.8rem); }
  .company-founders { gap: 42px; }
  .company-founder { grid-template-columns: 104px minmax(0, 1fr); gap: 22px; }
  .company-portrait { width: 104px; height: 104px; }
  .company-founder h3 { font-size: 22px; }
}
@media (max-width: 800px) {
  .company-wrap { width: calc(100% - 48px); }
  .company-about-hero { min-height: 0; padding-block: 46px 64px; grid-template-columns: minmax(0, 1fr) 180px; gap: 18px; }
  .company-about-copy h1 { font-size: clamp(2.5rem, 5.5vw, 3.5rem); }
  .company-about-copy > p { font-size: 14px; margin-top: 23px; }
  .company-page-label { margin-bottom: 23px; }
  .company-section { padding-block: 72px; }
  .company-expertise { margin-top: 50px; }
  .company-expertise dl > div, .company-principle-list > div { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 32px; }
  .company-founders { grid-template-columns: 1fr; gap: 52px; }
  .company-founder { grid-template-columns: 144px minmax(0, 1fr); gap: 30px; }
  .company-portrait { width: 144px; height: 144px; }
  .company-founder h3 { font-size: 25px; }
}
@media (max-width: 540px) {
  .company-about-hero { position: relative; display: block; padding-block: 40px 62px; }
  .company-about-copy { position: relative; z-index: 1; }
  .company-about-copy h1 { font-size: clamp(2.45rem, 9.1vw, 3.2rem); max-width: 380px; }
  .company-about-copy > p { max-width: 320px; }
  .company-symbol { position: absolute; width: 190px; top: 23px; right: -38px; opacity: .18; pointer-events: none; }
  .company-page h2 { font-size: clamp(1.85rem, 7.4vw, 2.4rem); }
  .company-section { padding-block: 62px; }
  .company-mission-copy > p, .company-section-heading > p, .company-contact p { font-size: 14px; line-height: 1.8; }
  .company-section-heading { margin-bottom: 34px; }
  .company-expertise dl > div, .company-principle-list > div { grid-template-columns: 1fr; gap: 10px; padding-block: 23px; }
  .company-expertise dd, .company-principle-list dd { font-size: 13px; }
  .company-founders { gap: 46px; }
  .company-founder { grid-template-columns: 88px minmax(0, 1fr); gap: 20px; }
  .company-portrait { width: 88px; height: 88px; }
  .company-founder h3 { font-size: 22px; }
  .company-founder-role { font-size: 10px; }
  .company-founder-bio { grid-column: 1 / -1; font-size: 13px; margin-top: 18px; }
  .company-founder-copy { display: contents; }
  .company-founder-copy h3, .company-founder-role { grid-column: 2; }
  .company-founder h3 { align-self: end; }
  .company-portrait { grid-row: span 2; }
  .company-founder-role { margin-top: -12px; }
  .company-background { grid-column: 1 / -1; margin-top: 0; }
  .company-contact-actions { align-items: flex-start; gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .company-text-link span, .company-background summary span { transition: none; }
}
