/* ===== HelloComp – Welcome (čistý card layout, jen CSS) ===== */

/* KARTA */
.welcimg-wrapper {
  background: transparent;             /* žádný velký gradient v pozadí */
  box-shadow: none;
  border: 0;
  padding: 0;
}

.welcimg-wrapper .welcome {
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(2, 6, 23, 0.06);
  padding: clamp(18px, 3vw, 32px);
}

/* TYPO */
.welcimg-wrapper .welcome h1 {
  margin: 0 0 14px 0;
  font-family: "new_font", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.15;
  color: #0f172a;
  letter-spacing: .2px;
}
.welcimg-wrapper .welcome h1::after {
  content: "";
  display: block;
  width: 64px; height: 3px;
  margin-top: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, #5ac8fa, #60a5fa);
}

.welcimg-wrapper .welcome p { 
  color: #334155; 
  line-height: 1.7;
  font-size: 15.5px;
  margin: 10px 0 12px;
}
.welcimg-wrapper .welcome p strong { color: #0b1220; }

/* ODKAZY */
.welcimg-wrapper .welcome a {
  color: #2563eb; text-decoration: none; font-weight: 600;
  border-bottom: 1px solid transparent; transition: border-color .2s ease, color .2s;
}
.welcimg-wrapper .welcome a:hover { color:#1d4ed8; border-bottom-color: rgba(37,99,235,.35); }

/* === 2 sloupce bez změny HTML ===
   HTML je: .welcome > h1 + div (uvnitř text + p.welcome-img)
   -> cílíme na to vnitřní div a uděláme z něj grid
*/
.welcimg-wrapper .welcome > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 520px; /* text | obrázek */
  gap: clamp(18px, 2.4vw, 28px);
  align-items: start;
}

/* obrázek do pravého sloupce, text do levého */
.welcimg-wrapper .welcome > div > p:not(.welcome-img) { grid-column: 1; }
.welcimg-wrapper .welcome .welcome-img { grid-column: 2; margin: 0; align-self: start; }

/* Obrázek – čistý, bez přepálených efektů */
.welcimg-wrapper .welcome .welcome-img img{
  width: 100%; height: auto; display: block;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, 0.07);
  box-shadow: 0 10px 22px rgba(2, 6, 23, 0.08);
  transform: translateZ(0);
  transition: transform .35s ease;
}
.welcimg-wrapper .welcome .welcome-img img:hover { transform: scale(1.015); }

/* Lepší čitelnost dlouhých odstavců v levém sloupci */
.welcimg-wrapper .welcome > div > p:not(.welcome-img) { max-width: 64ch; }

/* RESPONSIVE */
@media (max-width: 1100px){
  .welcimg-wrapper .welcome > div { grid-template-columns: minmax(0,1fr) 460px; }
}
@media (max-width: 900px){
  .welcimg-wrapper .welcome > div { grid-template-columns: 1fr; }
  .welcimg-wrapper .welcome .welcome-img { grid-column: 1; margin-top: 8px; }
  .welcimg-wrapper .welcome .welcome-img img { max-width: 100%; }
  .welcimg-wrapper .welcome { border-radius: 14px; }
}
@media (max-width: 560px){
  .welcimg-wrapper .welcome {
    padding: 16px 14px;
    box-shadow: 0 6px 14px rgba(2,6,23,.06);
  }
  .welcimg-wrapper .welcome h1::after{ width:52px; }
}