/* Článek – základní styl */
.clanek-titan {
  font-family: inherit;
  color: #fff;
  background-color: transparent;
  line-height: 1.6;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem 2rem 1rem;
}

@media (max-width: 767px) {
  .clanek-titan {
    padding-left: 0;
    padding-right: 0;
  }
}

/* Nadpisy a text */
.nadpis-clanek {
  font-size: 1.6rem;
  font-weight: 700;
  color: #fff;
}

.nadpis-clanek--h2 {
  font-size: 1.4rem;
  margin-top: 2.5rem;
  margin-bottom: 0.8rem;
}

.nadpis-clanek--h3 {
  font-size: 1.2rem;
  margin-top: 2rem;
  margin-bottom: 0.5rem;
}

.text-clanek,
.zaver-clanek,
.seznam-clanek,
.seznam-clanek li {
  color: #fff;
  font-size: 1rem;
}

.clanek-titan .text-clanek + .text-clanek {
  margin-top: 0.5rem;
}

.zaver-clanek {
  margin-top: 2.5rem;
  font-size: 1.2rem;
  font-weight: bold;
}

/* Seznamy */
.seznam-clanek {
  margin: 1rem 0 2rem 1.5rem;
  padding-left: 0.5rem;
  list-style: disc;
}

.seznam-clanek li {
  margin-bottom: 0.7rem;
}

/* Oddělovací linka */
.delic-clanek {
  border: none;
  border-top: 2px solid #faa603;
  margin: 3rem 0;
}

/* Obrázky v článku – vždy čtverec, bez deformace */
.titan-image {
  border: 0;
  box-shadow: 0 0 10px 2px #faa603;
  transition: transform 0.3s ease, box-shadow 0.5s ease;
  width: 100%;
  max-width: 420px;
  aspect-ratio: 1 / 1;    /* vždy čtverec */
  height: auto;
  object-fit: contain;    /* žádná deformace */
  display: block;
  margin: 0 auto;
}

/* Interní navigace – tlačítka na skrolování k sekcím */
.clanek-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.5rem 0 2rem;
}

.clanek-nav__button {
  display: inline-block;
  padding: 0.6rem 1.2rem;
  border-radius: 0;
  background-color: #faa603;
  border: 1px solid #faa603;
  color: #000;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  letter-spacing: 0.02em;
  transition: background-color 0.2s ease, color 0.2s ease,
    box-shadow 0.2s ease, transform 0.1s ease;
}

.clanek-nav__button:hover,
.clanek-nav__button:focus {
  background-color: transparent;
  color: #faa603;
  box-shadow: 0 0 8px rgba(250, 166, 3, 0.8);
  transform: translateY(-1px);
}

/* Dvousloupcové sekce: text + obrázek nebo dva obrázky */
.clanek-section {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin: 2.5rem 0;
  align-items: flex-start; /* mobil – normální chování */
}
.clanek-section__text,
.clanek-section__image {
  flex: 1 1 100%;
}

.clanek-section__image {
  display: flex;
  justify-content: center;
}
.clanek-section__image .titan-image {
  max-width: 420px;
}
/* Boxy s ikonami */
.titan-advantages {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin: 1.5rem 0;
}

.titan-advantage {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: #1b1b1b;
  padding: 1rem;
  border-radius: 8px;
}

.titan-advantage p {
  color: #fff;
}

.titan-icon-image {
  width: 70px;
  height: 70px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 4px;
}

/* Tabulka */
.table-wrapper-clanek {
  width: 100%;
  margin: 2rem 0;
  overflow: hidden;
}

.table-clanek {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 0.95rem;
  border: 2px solid #faa603;
  color: #fff;
}

.table-clanek th,
.table-clanek td {
  padding: 1rem;
  border: 1px solid #faa603;
  text-align: left;
  vertical-align: top;
  word-wrap: break-word;
  white-space: normal;
}

.table-clanek th {
  background-color: #faa603;
  color: #000;
  font-weight: bold;
}

.table-clanek tr:nth-child(even) {
  background-color: #1b1b1b;
}
.table-clanek tr:nth-child(odd) {
  background-color: #2a2a2a;
}
/* Desktop rozložení */
@media (min-width: 768px) {
  .clanek-section {
    align-items: center; /* výška podle obsahu, vertikální střed */
  }

  .clanek-section__text,
  .clanek-section__image {
    flex-basis: 50%;
  }

  /* Obrázek vlevo, text vpravo (row-reverse = obrázek vlevo) */
  .clanek-section--image-left-text-right {
    flex-direction: row-reverse;
  }

  /* Dva obrázky vedle sebe */
  .clanek-section--images-row {
    flex-direction: row;
  }
}