/* ==========================================================================
   about.css – „Poznaj nas" (Figma y 2100–3010)
   ========================================================================== */

.about { padding: 56px 48px 72px 20px; scroll-margin-top: 24px; }
.about .stage { display: block; }
.about__emblem { width: min(78%, 360px); margin: 0 0 20px -20px; }
.about__title { font-weight: 600; font-size: clamp(52px, 14.5vw, 88px); line-height: 1; letter-spacing: var(--ls-semi); white-space: nowrap; }
.about__subtitle { max-width: 14em; margin-top: 18px; font-weight: 300; font-size: 24px; line-height: 1.12; letter-spacing: .03em; }
.about__copy { max-width: 32em; margin-top: 18px; color: var(--font-2); font-size: 15px; line-height: 1.55; }
.about__cta { width: 198px; height: 52px; margin-top: 28px; border-radius: 8px; font-size: 18px; line-height: 1; }
.about .rail--right { top: 72px; right: 10px; }

@media (min-width: 700px) {
  .about { padding: 72px clamp(56px, 6vw, 84px) 96px 0; }
  .about .stage { display: grid; grid-template-columns: minmax(0, 36%) minmax(0, 1fr); column-gap: 3%; align-items: center; }
  .about__emblem { grid-column: 1; grid-row: 1; width: 100%; margin: 0; }
  .about__text { grid-column: 2; grid-row: 1; }
  .about__title { font-size: clamp(76px, 9.6vw, 118px); }
  .about__subtitle { margin-top: 22px; font-size: clamp(26px, 3vw, 32px); }
  .about__copy { margin-top: 22px; font-size: 17px; }
  .about .rail--right { top: 96px; right: clamp(18px, 3vw, 44px); }
}

@media (min-width: 1280px) {
  .about { --h: 910; padding: 0; scroll-margin-top: calc(-90 * var(--u)); }
  .about .stage { display: block; }
  .about__text { display: contents; }
  .about__emblem { margin: 0; width: calc(var(--w) * var(--u)); }
  .about__title { font-size: calc(150 * var(--u)); letter-spacing: calc(3 * var(--u)); line-height: 1; }
  .about__subtitle { margin: 0; max-width: none; font-size: calc(32 * var(--u)); line-height: 1; letter-spacing: calc(.96 * var(--u)); }
  .about__copy { margin: 0; max-width: none; font-size: calc(20 * var(--u)); line-height: 1; letter-spacing: calc(.4 * var(--u)); }
  .about__cta { width: calc(198 * var(--u)); height: calc(52 * var(--u)); margin: 0; border-radius: calc(8 * var(--u)); font-size: max(15px, calc(18 * var(--u))); }
  .about .rail--right { top: auto; right: auto; }
}