/* =====  DETAIL ===== */
.detail {
/*    background: linear-gradient(180deg, #FFFFFF 0%, #f7faff 100%); */
    border: 1px solid #fefefe;
    border-radius: 4px;
    box-shadow: 0 3px 9px rgba(0,0,0,0.06);
    margin-bottom: 14px;
    cursor: pointer;
    transition: all 0.2s ease;

}

.detail:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.08);
}

.detail-content {
    text-align: left; /* celé zarovnání doleva */
padding: 10px 20px;
margin-top: 0px;
    line-height: 1.6;
    /* odstraníme max-height a overflow-y */
    padding-right:10px;
}



.detail-content h2 {
    text-align: center;  /* titulek článku doprostřed */
    font-size: 18px;
    margin-bottom: 10px;
}

.detail-content p {
    text-align: left;    /* text článku doleva */
    color: #555; /* jemná tyrkysová */

}

.datum {
    color: #00589B; /* jemná tyrkysová */
}




/* ===== HLAVNÍ 2-SLOUPCOVÝ LAYOUT ===== */
.main-layout {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 10px;
}

/* levý – hlavní článek */
.left-column {
    flex: 1.5;
}

/* pravý – doplňkové texty */
.right-column {
    flex: 1;
    padding-left: 10px;
}



/* nadpisy jemnější */
h2 {
    letter-spacing: 1px;
    color: #3f4a54;
    font-size: 26px;



}

/* jemnější text */
p {
    color: #4a545c;
}


.features-pravy  {
    border-left: 1px solid #eee;
    padding-left: 10px;

}


.features-wrapper p {
    color: #00589B;
    opacity: 0.9;

}

.intro-text {
    margin-bottom: 5px;
}


.detail-content img {
    float: left;
    margin-right: 15px;
    margin-bottom: 10px;
    margin-top: 8px; /* doladíš podle potřeby, zkus 4-6px */
    border-radius: 5px;
    box-shadow: 3px 3px 10px rgba(0,0,0,0.3);
    max-width: 200px; /* zachování proporcí */
    height: auto;     /* zachování proporcí */
}

.ccanvas {
    position: relative;
    width: 720px; height: 540px;
    background: #fff;
  /*  border: 1px solid #ccc;*/
    overflow: hidden;

    margin: 0 auto; /* 🔥 tohle je důležité */
}

.ccanvas .blok {
    position: absolute;
    width: 200px;
}

.ccanvas .blok h3 {
    margin: 0;
    background: #f0ffff;
    padding: 5px;
    font-size: 14px;
}

.ccanvas .blok ul {
    margin: 0;
    padding: 5px 10px;
    font-size: 13px;
}

.ccanvas .blok ul li a {
    float: left;

    color: #00589B;       /* hezká modrá */
    text-decoration: none; /* žádné podtržení */
    transition: color 0.2s; /* jemný přechod při hover */

}

.ccanvas .blok ul li a:hover {
    color: #ff6600;        /* při najetí změna barvy */
    text-decoration: underline; /* může být podtržení jen při hover */
}


@media (max-width: 768px) {
    .main-layout {
        flex-direction: column;
    }
}