.subpage,
.case-study,
.course-detail-page {
width: min(var(--t-sirka), calc(100% - 2 * var(--t-okraj)));
margin-inline: auto;
padding-block: var(--t-mezera-bloku);
}
.subpage-hero,
.case-hero,
.course-detail-hero {
padding-bottom: var(--t-mezera);
margin-bottom: var(--t-mezera-bloku);
border-bottom: var(--t-ramecek);
}
.subpage-hero h1,
.case-hero h1,
.course-detail-hero h1 {
margin: 0 0 12px;
max-width: 22ch;
}
.subpage-hero > p,
.case-hero > p,
.course-detail-hero > p {
margin: 0;
max-width: 62ch;
color: var(--t-text-tlumeny);
}
.subpage-meta,
.case-meta,
.course-eyebrow,
.section-kicker {
display: flex;
flex-wrap: wrap;
gap: 6px 14px;
margin: 0 0 14px;
font-size: 0.78rem;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--t-text-tlumeny);
}
.subpage-axis { display: none; }
.web-sipka,
.web-ikona {
display: inline-block;
width: 1em;
height: 1em;
flex: none;
vertical-align: -0.12em;
}
.web-zpet {
margin-top: var(--t-mezera-bloku);
padding-top: var(--t-mezera);
border-top: var(--t-delici-linka);
}
.web-zpet a {
display: inline-flex;
align-items: center;
gap: 6px;
font-weight: 600;
text-decoration: none;
color: var(--t-text);
}
.web-zpet a:hover { text-decoration: underline; }
.web-zpet .web-sipka { transform: rotate(180deg); }
.article-body { max-width: var(--t-sirka-uzka); }
.article-body > :first-child { margin-top: 0; }
.article-body > :last-child { margin-bottom: 0; }
.contact-form {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px var(--t-mezera);
}
.contact-form .span-two { grid-column: 1 / -1; }
.contact-form label {
display: flex;
flex-direction: column;
gap: 6px;
font-size: 0.9rem;
}
.contact-form label > span { font-weight: 600; }
.contact-form label > small { color: var(--t-text-tlumeny); }
.contact-form input:not([type="checkbox"]):not([type="radio"]),
.contact-form select,
.contact-form textarea {
width: 100%;
padding: 10px 12px;
border: var(--t-ramecek);
border-radius: var(--t-zaobleni);
background: var(--t-pozadi);
color: var(--t-text);
font: inherit;
}
.contact-form input:focus-visible,
.contact-form select:focus-visible,
.contact-form textarea:focus-visible {
outline: 2px solid var(--t-akcent);
outline-offset: 2px;
}
.contact-form .form-submit {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 12px var(--t-mezera);
padding-top: var(--t-mezera);
border-top: var(--t-delici-linka);
}
.contact-form .form-submit p {
margin: 0;
max-width: 46ch;
font-size: 0.85rem;
color: var(--t-text-tlumeny);
}
.contact-form button[type="submit"] {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 22px;
border: var(--t-sila-linky) solid var(--t-akcent);
border-radius: var(--t-zaobleni);
background: var(--t-akcent);
color: var(--t-akcent-text);
font: inherit;
font-weight: 600;
cursor: pointer;
transition: background var(--t-rychlost) var(--t-krivka), color var(--t-rychlost) var(--t-krivka);
}
.contact-form button[type="submit"]:hover {
background: var(--t-pozadi);
color: var(--t-akcent);
}
@media (max-width: 640px) {
.contact-form { grid-template-columns: minmax(0, 1fr); }
}