/* YABI 2.0 v3 – O nás. Návrh: About / Desktop 674:5179, mobil 682:2111. Zdieľa triedy hero/step z home.css. */
.about-hero{padding-bottom:80px}
.about-hero__aside{gap:24px}
.about-hero__heart{width:123px;height:102px}
.about-stories{display:flex;flex-direction:column;gap:32px}
.about-stories__head{justify-content:flex-end}
.about-copy{display:flex;flex-direction:column;gap:24px}
.about-copy .placeholder{margin-bottom:-12px}
.step--blue .about-copy,.step--red .about-copy{color:var(--paper)}
@media (max-width:1023px){.about-stories__head .progress{width:100%}}
@media (max-width:767px){
  /* Podľa návrhu About / Mobile 682:2111 (390 px): navigácia 96 px + 64 px nad štítkom, nadpis 44/48, perex 18/24, srdce 123 × 102 */
  .about-hero{padding:160px var(--gutter) 64px}
  .about-hero .hero__title{font-size:44px;line-height:48px;letter-spacing:-1.32px}
  .about-hero .hero__perex{font-size:18px;line-height:24px;letter-spacing:-.36px}
  .about-hero__aside{position:relative}
  .about-hero__heart{width:123px;height:102px}
  /* Štítok ZÁSTUPNÝ TEXT mimo toku (vedľa srdca / v rohu karty), aby nemenil zalomenie a výšky z návrhu */
  .about-hero .hero__perex .placeholder{position:absolute;right:0;bottom:0}
  .about-stories .step__copy{position:relative}
  .about-copy__flag{position:absolute;top:18px;right:24px;margin:0}
  .about-copy .placeholder{margin:0}

  /* Odstavce: orezaný blok (cap/alphabetic) ako v návrhu; prázdny riadok medzi odstavcami = 24 px */
  .about-copy{margin-block:calc(.3425em - 12px) calc(.3575em - 12px)}
  /* „Kde sídlime?“ – v návrhu dva samostatne orezané texty s medzerou 24 px (24 − orezanie 6,28 − 6,52) */
  .about-copy--split{gap:11.2px}

  /* Kontakt „Poďme sa zoznámiť“ (691:2568): bez odkazu na hovor. Správa má spoločnú výšku (nie 36 px z návrhu) –
     schválený placeholder má 2 riadky a v 36 px poli by bol orezaný. */
  .page-o-nas .form__call{display:none}
}
@media (min-width:768px){.br-mob{display:none}}


/* Current Figma674:5223/5239/5249,682:2121/2137/2147. */
.about-stories .step__intro{margin-top:0}
.about-stories .step__copy{position:relative}
.about-stories .about-copy{gap:0;margin:0}
.about-stories .step__media img{transform:none!important;transition:none}
.about-stories .about-copy--support{margin-top:24px}
@media(min-width:1024px){
 .about-stories .step{height:430px;min-height:430px}
 .about-stories .step__copy{padding:32px;flex:0 0 560px;justify-content:flex-start}
 .about-stories .about-copy--support{position:absolute;top:259px;left:32px;right:32px;margin:0}
 .about-stories .step:first-child .about-copy--support{top:265px}
 .about-stories .carousel .slider__arrow{top:191px;bottom:auto}
 .about-stories .carousel .slider__arrow--prev{left:24px;right:auto}
 .about-stories .carousel .slider__arrow--next{right:24px;left:auto}
 .about-stories .carousel .slider__dots{left:50%;right:auto;bottom:16px;transform:translateX(-50%)}
}
@media(max-width:767px){
 .about-stories__head{display:none}
 .about-stories .steps{display:flex;flex-direction:column;gap:16px;overflow:visible;padding:0;margin:0}
 .about-stories .step{height:auto;min-height:0;flex:none;width:100%}
 .about-stories .step__copy{padding:24px;flex:none;gap:0}
 .about-stories .step__title{line-height:32px}
 .about-stories .step__media{height:auto;aspect-ratio:720/430}
 .about-stories .carousel{--media-h:calc((100vw - 40px)*430/720)}
 .about-stories .carousel .slider__dots{bottom:25px}
 .about-stories .carousel .slider__arrow{bottom:calc(var(--media-h) - 124px)}
 .about-stories .step{position:relative}
}

.about-stories .about-copy{display:block}
/* Figma trims text to cap/alphabetic, not cap/descender (text). */
@supports(text-box:trim-both cap alphabetic){.about-stories .trim{text-box:trim-both cap alphabetic}}
@media(max-width:767px){.about-stories .step:nth-child(-n+2) .about-copy--support{margin-top:36px}}
.about-stories .slider__dots{gap:8px;padding:6px 10px}
.about-stories .slider__dots button{width:8px;height:8px;min-width:8px;padding:0}
.about-stories .slider__dots button{margin:0}
.about-stories .slider__dots button::before{left:0;top:0}
.about-stories .slider__dots button::after{content:"";position:absolute;inset:-8px}