/* CJ | Náš příběh | v3 doplněk (navazuje na CJ_Nas_pribeh_STYL.css?v=1)
   Stránka: /o-e-shopu/ | Všechny selektory jsou omezené na #cj-story.
   Nezasahuje do globálního stylu e-shopu. */

/* Nadpis hero – semanticky H2, vizuálně jako původní hero H1. */
#cj-story .cj-story__hero-copy .cj-story__hero-title {
  color: #fff;
  font-family: inherit;
  font-size: clamp(32px, 3.8vw, 52px);
  font-weight: 900;
  line-height: 1.09;
  letter-spacing: -0.035em;
  margin: 18px 0 19px;
}
#cj-story .cj-story__hero-copy .cj-story__hero-title em {
  color: #97e477;
  font-style: normal;
}

/* Odkazy v úvodním bloku */
#cj-story .cj-story__hero-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 23px;
}
#cj-story .cj-story__hero-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(225, 243, 227, .32);
  background: rgba(255, 255, 255, .07);
  border-radius: 10px;
  color: #f8fff5;
  text-decoration: none;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
#cj-story .cj-story__hero-nav a:hover,
#cj-story .cj-story__hero-nav a:focus-visible {
  background: rgba(142, 226, 105, .17);
  border-color: #9be87f;
  color: #fff;
  transform: translateY(-1px);
}
#cj-story .cj-story__hero-nav a span {
  color: #a3ee7a;
}

/* Časová osa – fotografie skutečně vyniknou, ale karty si zachovají vzhled */
#cj-story .cj-story__milestone:not(.cj-story__milestone--plain) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(235px, 35%);
  align-items: center;
  column-gap: clamp(18px, 2.8vw, 30px);
  row-gap: 16px;
}
#cj-story .cj-story__milestone .cj-story__milestone-copy {
  min-width: 0;
}
#cj-story .cj-story__milestone-visual {
  margin: 0;
  width: 100%;
  min-width: 0;
}
#cj-story .cj-story__milestone-visual .cj-story__media {
  display: block;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 13px;
}
#cj-story .cj-story__milestone-visual .cj-story__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
#cj-story .cj-story__photo-caption {
  color: #737e75;
  font-family: inherit;
  font-size: 11px;
  line-height: 1.35;
  text-align: right;
  margin-top: 7px;
}

/* Tým: dvě rovnocenné karty zakladatelů, pod nimi tři kolegové */
#cj-story .cj-story__teams-v3 {
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 4vw, 44px);
}
#cj-story .cj-story__team-group { min-width: 0; }
#cj-story .cj-story__team-kicker {
  text-align: center;
  margin: 0 0 13px;
  color: #2d8234;
  font-weight: 800;
  font-size: 12px;
  line-height: 1.35;
  letter-spacing: .07em;
  text-transform: uppercase;
}
#cj-story .cj-story__team.cj-story__team--founders,
#cj-story .cj-story__team.cj-story__team--crew {
  display: grid !important;
  align-items: stretch;
  justify-content: center;
  column-gap: 20px;
  row-gap: 20px;
  margin-inline: auto;
}
#cj-story .cj-story__team.cj-story__team--founders {
  width: min(100%, 736px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#cj-story .cj-story__team.cj-story__team--crew {
  width: min(100%, 960px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#cj-story .cj-story__team--founders > .cj-story__person,
#cj-story .cj-story__team--crew > .cj-story__person {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
}
#cj-story .cj-story__team--founders > .cj-story__person > .cj-story__media,
#cj-story .cj-story__team--crew > .cj-story__person > .cj-story__media {
  width: 100%;
  aspect-ratio: 4 / 5;
  height: auto !important;
  overflow: hidden;
}
#cj-story .cj-story__team--founders .cj-story__photo,
#cj-story .cj-story__team--crew .cj-story__photo {
  width: 100% !important;
  height: 100% !important;
  display: block;
  object-fit: cover;
}
#cj-story .cj-story__team--founders .cj-story__person-body,
#cj-story .cj-story__team--crew .cj-story__person-body {
  flex: 1 1 auto;
}

/* Jemně vyznačený konec příběhu (bez zásahu do hodnocení obchodu a footeru) */
#cj-story .cj-story__footer-tail {
  margin: 19px auto 0;
  padding: 13px 0 10px;
  text-align: center;
  border-top: 1px solid #e1e9df;
  max-width: 530px;
}
#cj-story .cj-story__footer-tail .cj-story__closing {
  margin: 0;
  color: #7a877c;
}

/* Tablet */
@media (max-width: 800px) {
  #cj-story .cj-story__milestone:not(.cj-story__milestone--plain) {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 36%);
    column-gap: 16px;
  }
  #cj-story .cj-story__team.cj-story__team--crew {
    width: min(100%, 620px);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #cj-story .cj-story__team--crew > .cj-story__person:last-child {
    grid-column: 1 / -1;
    max-width: 300px !important;
    justify-self: center;
  }
}

/* Mobilní rozložení */
@media (max-width: 620px) {
  #cj-story .cj-story__hero-copy .cj-story__hero-title {
    font-size: clamp(29px, 8.5vw, 40px);
    margin: 15px 0 18px;
  }
  #cj-story .cj-story__hero-nav { gap: 9px; margin-top: 17px; }
  #cj-story .cj-story__hero-nav a { width: 100%; }
  #cj-story .cj-story__milestone:not(.cj-story__milestone--plain) {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  #cj-story .cj-story__milestone-visual { width: 100%; }
  #cj-story .cj-story__photo-caption { text-align: left; }
  #cj-story .cj-story__team.cj-story__team--founders,
  #cj-story .cj-story__team.cj-story__team--crew {
    grid-template-columns: minmax(0, 1fr);
    width: min(100%, 410px);
  }
  #cj-story .cj-story__team--crew > .cj-story__person:last-child {
    grid-column: auto;
    max-width: none !important;
  }
  #cj-story .cj-story__team-kicker { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  #cj-story .cj-story__hero-nav a { transition: none; }
}