.company-story { position: relative; overflow: hidden; padding: 112px clamp(20px, 4vw, 64px) 96px; background: radial-gradient(90% 70% at 70% 45%, #0f3a2d 0%, #0a231d 40%, #050d0a 100%); color: #f3f1ea; scroll-margin-top: 80px; }
.company-story::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(191, 240, 138, .1) 1px, transparent 1px); background-size: 28px 28px; -webkit-mask-image: radial-gradient(60% 60% at 70% 50%, #000, transparent); mask-image: radial-gradient(60% 60% at 70% 50%, #000, transparent); pointer-events: none; }
.company-story-grid { position: relative; max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 40px 24px; align-items: center; }
.company-story-copy { display: flex; flex-direction: column; gap: 32px; max-width: 580px; min-width: 0; }
.company-story-copy > * { margin: 0; }
.company-story-eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font: 12px/1.4 'JetBrains Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: #9fd8b4; }
.company-story-eyebrow span { padding: 5px 10px; border-radius: 999px; background: #bff08a; color: #0a231d; font-weight: 500; letter-spacing: .1em; }
.company-story-copy h2 { font-size: clamp(38px, 4.6vw, 72px); line-height: 1; letter-spacing: -.035em; font-weight: 600; }
.company-story-copy h2 span { color: #bff08a; }
.company-story-points { padding: 0; list-style: none; display: flex; flex-direction: column; gap: 14px; font-size: 18px; line-height: 1.5; color: #d7e4dc; }
.company-story-points li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 12px; }
.company-story-points span { color: #bff08a; font: 13px/1.5 'JetBrains Mono', monospace; padding-top: 4px; }
.company-story-copy .company-story-link { display: inline-flex; align-items: center; gap: 10px; width: fit-content; padding: 14px 22px; border-radius: 999px; background: #f3f1ea; color: #0a231d; font-weight: 600; font-size: 16px; line-height: 1.3; text-decoration: none; }
.company-story-copy .company-story-link:hover { background: #bff08a; color: #0a231d; }
.company-story-link span { font-family: 'JetBrains Mono', monospace; }
.company-story-preview { position: relative; min-width: 0; margin: 0; }
.company-story-preview::before { content: ''; position: absolute; inset: 20% 10% 10%; background: radial-gradient(closest-side, rgba(52, 211, 153, .28), transparent); filter: blur(30px); pointer-events: none; }
.company-story-preview img { position: relative; display: block; width: 118%; max-width: none; height: auto; margin-left: -9%; }
.company-story-preview figcaption { position: relative; font-size: 12px; color: #9fb3a9; margin-top: 8px; text-align: center; }
.company-story-privacy { position: relative; max-width: 1320px; margin: 72px auto 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 1px; background: rgba(191, 240, 138, .14); border: 1px solid rgba(191, 240, 138, .14); border-radius: 14px; overflow: hidden; }
.company-story-privacy > div { background: #07140f; padding: 24px 26px; display: flex; flex-direction: column; gap: 10px; }
.company-story-privacy dt { font: 12px/1.4 'JetBrains Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
.company-story-privacy dd { margin: 0; font-size: 16px; line-height: 1.5; color: #d7e4dc; }
.company-story-privacy .company-story-always { color: #34d399; }
.company-story-privacy .company-story-choice { color: #f0b25a; }
.company-story-privacy .company-story-never { color: #8fa39a; }
.company-pricing { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .75fr); gap: 34px; padding: 28px; margin-top: 32px; border: 1px solid #465445; background: #101711; border-radius: 4px; scroll-margin-top: 90px; }
.company-pricing h3 { margin: 0 0 10px; font-size: 25px; }
.company-pricing p { margin: 10px 0 0; color: #b8b4aa; font-size: 14px; line-height: 1.6; }
.company-pricing .company-seat-price { color: #f2efe8; font-size: 35px; font-weight: 500; line-height: 1.2; margin: 0 0 16px; }
.company-seat-price span { font-size: 14px; font-weight: 400; color: #b8b4aa; }
.company-seat-calculator { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding-left: 28px; border-left: 1px solid #344633; min-width: 0; }
.company-seat-calculator label { color: #f2efe8; font-size: 14px; }
.company-seat-calculator input[type="number"] { display: block; margin-top: 6px; width: 120px; padding: 10px 12px; border: 1px solid #526650; border-radius: 3px; background: #0a0a0a; color: #f2efe8; font: inherit; }
.company-seat-calculator output { color: #d5efce; font-size: 15px; font-variant-numeric: tabular-nums; }
.company-seat-calculator button { cursor: pointer; font: 600 14px/1.3 'Instrument Sans', sans-serif; max-width: 100%; }
.company-story .company-language-note, .company-pricing .company-language-note { color: #a19d94; font-size: 12px; }
.company-story .company-language-note { color: #9fb3a9; }
@media (max-width: 760px) { .company-story { padding-block: 64px 56px; } .company-story-copy { gap: 24px; } .company-story-points { font-size: 16px; } .company-story-privacy { margin-top: 48px; } .company-story-privacy > div { padding: 20px; } .company-pricing { grid-template-columns: minmax(0, 1fr); padding: 22px; gap: 24px; } .company-seat-calculator { padding: 22px 0 0; border-left: 0; border-top: 1px solid #344633; } .company-story-preview figcaption { font-size: 11px; } }