/* =============================================================================
Rezidence 3 Dvory - components.css
=============================================================================
Sdilene CSS pro komponenty: buttons, breadcrumb, container, animations.
Linkovat ve ZA 'style.css':
Pridano 2026-05-02 (Faze 6: extrakce sdileneho CSS, Stupen 3).
============================================================================= */
/* Container ---------------------------------------------------------------- */
.container {
width: 100%;
max-width: 1280px;
margin: 0 auto;
padding: 0 24px;
}
/* Buttons ------------------------------------------------------------------ */
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 16px 32px;
font-family: var(--font-body);
font-size: 1rem;
font-weight: 500;
text-decoration: none;
border-radius: 4px;
border: 2px solid transparent;
cursor: pointer;
transition: var(--transition);
min-height: 52px;
}
.btn-primary {
background-color: var(--color-primary);
color: #FFFFFF;
border-color: var(--color-primary);
}
.btn-primary:hover {
background-color: var(--color-primary-dark);
border-color: var(--color-primary-dark);
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(177, 85, 54, 0.35);
}
.btn-secondary {
background-color: transparent;
color: var(--color-primary);
border-color: var(--color-primary);
}
/* Breadcrumb --------------------------------------------------------------- */
.breadcrumb {
display: flex;
justify-content: center;
gap: 12px;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
margin-bottom: 24px;
}
.breadcrumb a {
color: rgba(255, 255, 255, 0.7);
text-decoration: none;
transition: var(--transition);
}
.breadcrumb a:hover { color: #FFFFFF; }
/* Fade-in animation -------------------------------------------------------- */
.fade-in {
opacity: 0;
transform: translateY(30px);
transition: all 0.6s ease;
}
.fade-in.visible {
opacity: 1;
transform: translateY(0);
}