/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.5.15,
* Autoprefixer: v10.5.0
* Browsers: last 4 version
*/

/* ============================================================
   ABOUT ME PAGE
   ============================================================ */

.about-section{
	background-color: var(--secondary-color) !important;
	padding-bottom: 0 !important;
}
.about-section h1, .about-section h2, .about-section p{
	color: #fff !important;
}
/* ── Sekce 2 — My Story (brand-intro, jen s eyebrow labelem
   navíc a jednou statickou fotkou místo photo-duo relay) ──── */
.brand-intro .brand-intro-eyebrow {
  display: block;
  text-align: center;
  color: var(--background-color);
  opacity: 0.75;
  margin-bottom: 14px;
}

/* Jednofotkový modifier — přebírá rozměry/aspect-ratio z
   .brand-photo-window--large (420px, 3/4), ale bez mobilních
   pravidel pro .brand-photo-window--large, která počítala s
   párovým malým oknem vedle sebe (brand-photo-duo). Bez tohoto
   override by na mobilu fotka dostala jen "flex:1 1 0" uvnitř
   sloupcového flexu a natáhla se do zvláštní výšky. */
@media (max-width: 680px) {
  .brand-photo-single {
    -webkit-box-flex: 1 !important;
        -ms-flex: 1 1 auto !important;
            flex: 1 1 auto !important;
    width: 100% !important;
    margin-right: 0 !important;
    aspect-ratio: 3 / 4 !important;
  }
}

/* ── Sekce 3 — My Approach ──────────────────────────────────
   Layout (.container, .row-media-text, .eyebrow-label) je
   převzatý z už existujících globálních utility tříd webu —
   .row-media-text tam byla definovaná, ale zatím nikde
   nepoužitá. Nadpis (h2) dědí italic serif automaticky z
   globálního h1,h2,h3 pravidla, takže mu stačí jen doladit
   velikost. Nové je jen padding sekce, zvýrazněná závěrečná
   věta (stejný vzor jako .package-highlight) a barva boldu
   v bullet seznamu. */
.approach-section {
  background-color: #fff;
  padding-block: var(--section-pad-y);
}
.approach-text .approach-eyebrow {
  display: block;
  margin-bottom: 12px;
}
.approach-heading {
  font-size: var(--heading-lg);
  line-height: 1.25;
  margin: 0 0 20px;
}
.approach-bullets {
  margin: 0 0 20px;
}
.approach-bullets strong {
  color: var(--text-primary);
  font-weight: 400;
}
.approach-goal {
  font-family: var(--font-body);
  font-style: italic;
  font-weight: 300;
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: 0.2px;
  color: var(--text-primary);
  margin: 0;
}

/* ── Sekce 4 — Closing CTA (stejný vzor jako
   investment-cta-section / loc-cta-section) ────────────────── */
.about-cta-section {
  background-color: var(--secondary-color);
  padding-block: var(--section-pad-y);
  text-align: center;
  overflow: hidden;
}
.about-cta-heading {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 300;
  color: var(--background-color);
  font-size: var(--heading-lg);
  line-height: 1.3;
  max-width: 560px;
  margin: 0 auto 16px;
}
.about-cta-text {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.6;
  color: var(--background-color);
  opacity: 0.9;
  max-width: 480px;
  margin: 0 auto 32px;
}
@media (max-width: 680px) {
  .about-cta-heading { font-size: 24px; }
  .approach-section .container{padding-right: 0; }
  .approach-media {
    height: 100vh;
}
  .approach-media img {height: 100% !important; -o-object-fit: cover !important; object-fit: cover !important;}

}