/* ==========================================================================
   Miss Sporty Contest - Complete Brand Design
   Jemný design s růžovými a modrými akcenty
   ========================================================================== */

/* Font Face Definitions - Avenir */
@font-face {
    font-family: 'Avenir';
    src: url('../assets/fonts/Avenir-Light-07.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Avenir';
    src: url('../assets/fonts/Avenir-Book-01.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Avenir';
    src: url('../assets/fonts/Avenir-Roman-12.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Avenir';
    src: url('../assets/fonts/Avenir-Medium-09.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Avenir';
    src: url('../assets/fonts/Avenir-Heavy-05.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Avenir';
    src: url('../assets/fonts/Avenir-Black-03.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

/* ==========================================================================
   1. CSS Variables - Brand Colors
   ========================================================================== */
:root {
    /* Barevná paleta */
    --ms-gradient-start: #69C2BD;
    --ms-gradient-end: #A9D7D6;
    --ms-pink: #E37F9A;
    --ms-white: #FFFFFF;
    --ms-turquoise: #1FB3C7;
    --ms-dark-blue: #007B8A;
    
    /* Text colors */
    --ms-text-primary: #333333;
    --ms-text-secondary: #666666;
    --ms-text-light: #999999;
    
    /* Jemné stíny */
    --ms-shadow-soft: 0 2px 8px rgba(0, 0, 0, 0.05);
    --ms-shadow-medium: 0 4px 12px rgba(0, 0, 0, 0.08);
    --ms-shadow-large: 0 8px 24px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   2. Base Styles
   ========================================================================== */
* {
    box-sizing: border-box;
    border-radius: 0 !important;
}

body {
    font-family: 'Avenir', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 18px !important;
    color: var(--ms-text-primary) !important;
    line-height: 1.6 !important;
    background: linear-gradient(180deg, #c0dfdf 0%, #86c8c5 100%) !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Typography */
h1, .hero-title {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 900 !important; /* Avenir Black */
    text-transform: uppercase !important;
    font-size: 83px !important; /* Zvětšeno o 30% z 64px */
    letter-spacing: 2px !important;
    color: var(--ms-white) !important;
    line-height: 0.9 !important;
    margin-bottom: 2rem !important;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.3), 0 0 20px rgba(255, 255, 255, 0.2) !important;
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
}

.hero-line-1 {
    display: flex !important;
    align-items: center !important;
    font-size: 83px !important; /* Zvětšeno o 30% z 64px */
    margin-bottom: 0 !important;
    line-height: 0.85 !important;
}

.hero-line-1 .text-blue {
    color: var(--ms-turquoise) !important;
    margin-left: 0.5rem !important;
    display: inline-block !important;
    line-height: 0.9 !important;
    font-size: 42px !important; /* Zvětšeno o 30% z 32px */
    text-shadow: none !important; /* Odstranění stínu */
}

.hero-line-2 {
    display: block !important;
    font-size: 62px !important; /* Zvětšeno o 30% z 48px */
    margin-left: 2rem !important;
    margin-bottom: 0.2rem !important;
    color: var(--ms-turquoise) !important;
}

/* Logo místo textu v hero nadpisu */
.hero-logo-text {
    display: block !important;
    width: auto !important;
    height: 100px !important;
    margin: 0rem 0 0.2rem 0 !important;
    object-fit: contain !important;
}

.hero-line-3 {
    display: block !important;
    font-size: 73px !important; /* Zvětšeno o 30% z 56px */
    margin-left: 4rem !important;
    line-height: 0.85 !important;
}

h2, .section-title {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 900 !important; /* Avenir Black - sjednoceno */
    font-size: 48px !important; /* Zvětšeno */
    color: var(--ms-text-primary) !important;
    margin-bottom: 2rem !important;
    text-align: center !important;
    position: relative !important;
    padding-bottom: 1rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

h3 {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 28px !important;
    color: var(--ms-text-primary) !important;
    margin-bottom: 1rem !important;
}

h4 {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 24px !important;
    color: var(--ms-text-primary) !important;
    margin-bottom: 1rem !important;
}

p {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 400 !important; /* Avenir Book - pro lepší čitelnost */
    font-size: 16px !important;
    color: var(--ms-text-secondary) !important;
    line-height: 1.6 !important;
}

small {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 400 !important; /* Avenir Book */
    font-size: 14px !important;
    color: var(--ms-text-primary) !important; /* Tmavší pro lepší čitelnost */
    line-height: 1.3 !important;
}

a {
    color: var(--ms-turquoise) !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

a:hover {
    color: var(--ms-dark-blue) !important;
}

/* ==========================================================================
   3. Navigation - Jemná bez černých obrysů
   ========================================================================== */
.contest-nav {
    background-color: var(--ms-white) !important;
    box-shadow: var(--ms-shadow-soft) !important;
    border: none !important;
    padding: 1rem 0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
}

.nav-wrapper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.nav-logo-img {
    height: 40px !important; /* Zmenšeno z 50px */
    width: auto !important;
}

.nav-menu {
    display: flex !important;
    gap: 2rem !important;
    align-items: center !important;
}

.nav-link {
    color: var(--ms-text-primary) !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 16px !important;
    padding: 0.5rem 1rem !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    border: none !important;
    outline: none !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.nav-link:hover {
    color: var(--ms-pink) !important;
    background-color: rgba(227, 127, 154, 0.1) !important;
    border: none !important;
    outline: none !important;
}

.nav-link:focus {
    outline: none !important;
    box-shadow: none !important;
}

.nav-link.active {
    color: var(--ms-turquoise) !important;
    background-color: rgba(31, 179, 199, 0.1) !important;
    border: none !important;
    outline: none !important;
}

.nav-mobile-toggle {
    display: none !important;
}

/* Mobile menu styles */
@media (max-width: 768px) {
    .nav-menu {
        position: fixed !important;
        top: 60px !important;
        left: -100% !important;
        width: 100% !important;
        background-color: var(--ms-white) !important;
        flex-direction: column !important;
        padding: 2rem 0 !important;
        box-shadow: var(--ms-shadow-large) !important;
        transition: left 0.3s ease !important;
        z-index: 999 !important;
    }
    
    .nav-menu.nav-menu-active {
        left: 0 !important;
    }
    
    .nav-link {
        width: 100% !important;
        text-align: center !important;
        padding: 1rem !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    }
    
    .nav-mobile-toggle {
        display: block !important;
        font-size: 24px !important;
        color: var(--ms-turquoise) !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
    }
    
    .nav-mobile-toggle.active i:before {
        content: "\f00d" !important; /* X ikona */
    }
}

/* ==========================================================================
   4. Hero Section
   ========================================================================== */
.hero-section {
    background: linear-gradient(180deg, #c0dfdf 0%, #86c8c5 100%) !important;
    padding: 4rem 0 !important;
    position: relative !important;
    overflow: hidden !important;
    border-bottom: none !important;
}

.text-accent {
    color: var(--ms-turquoise) !important;
    text-shadow: none !important;
}

.hero-subtitle {
    font-size: 18px !important;
    color: var(--ms-white) !important;
    margin-bottom: 2rem !important;
    font-weight: 400 !important; /* Avenir Book */
}

/* Hero Visual - polarbox nahore */
.hero-image {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: center !important;
    height: 100% !important;
    padding-top: 0 !important;
}

.hero-image .hero-logo {
    margin-top: 1rem !important; /* Malé odsazení od vrchu */
    margin-bottom: 1rem;
    max-width: 400px !important; /* Maximální šířka na PC */
    width: 100% !important;
    height: auto !important;
}

.polarbox{
  margin-bottom: 2rem !important;
}

/* Hero wrapper - zarovnání */
.hero-section .row {
    align-items: stretch !important; /* Stejná výška sloupců */
}

/* Hero content - flex container */
.hero-content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: 100% !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Contest Duration Badge - J
```jemné růžové pozadí */
.contest-duration-badge {
    display: inline-flex !important;
    align-items: center !important;
    background-color: var(--ms-pink) !important;
    color: var(--ms-white) !important;
    padding: 0.75rem 1.5rem !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 16px !important;
    margin-bottom: 2rem !important;
    box-shadow: var(--ms-shadow-medium) !important;
}

.contest-duration-badge i {
    margin-right: 0.5rem !important;
}

/* Contest Duration Badge White - pro pravý sloupec */
.contest-duration-badge-white {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: var(--ms-white) !important;
    color: var(--ms-text-primary) !important;
    padding: 0.75rem 1.5rem !important;
    font-weight: 700 !important; /* Avenir Heavy */
    box-shadow: var(--ms-shadow-medium) !important;
    width: 100% !important;
    font-size: 16px !important;
}

.contest-duration-badge-white i {
    color: var(--ms-pink) !important;
}

/* Prize Info Box - Bez pozadí */
.prize-info {
    background-color: transparent !important;
    padding: 0 !important;
    margin: 2rem 0 0 0 !important;
    box-shadow: none !important;
    margin-top: auto !important; /* Přitlačí box ke spodní části */
}

.prize-info h3 {
    color: var(--ms-white) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.prize-list {
    display: flex !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    margin-top: 1.5rem !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

.prize-item {
    text-align: center !important;
    flex: 1 !important;
    padding: 0.75rem 0.5rem !important; /* Menší horizontální padding */
    background-color: rgba(255, 255, 255, 0.3) !important; /* Poloprůhledná bílá */
    transition: all 0.3s ease !important;
    box-shadow: none !important;
    border: none !important;
    margin: 0 0.25rem !important; /* Menší margin */
}

.prize-item:hover {
    background-color: rgba(255, 255, 255, 0.5) !important;
    transform: translateY(-3px) !important;
    box-shadow: none !important;
}

.prize-item small {
    color: var(--ms-text-primary) !important; /* Tmavá barva pro lepší čitelnost */
    line-height: 1.15 !important; /* Ještě menší line-height */
    display: block !important;
    margin-top: 0.2rem !important;
    font-size: 13px !important; /* Menší font */
    font-weight: 700 !important; /* Tučné písmo pro lepší čitelnost */
}

.prize-item:hover small {
    color: var(--ms-text-primary) !important;
}

.prize-count {
    display: block !important;
    font-size: 42px !important; /* Zmenšeno z 48px */
    font-weight: 900 !important;
    color: var(--ms-turquoise) !important; /* Tyrkysová barva */
    line-height: 1 !important;
    margin-bottom: 0.3rem !important;
}

.prize-item:hover .prize-count {
    color: var(--ms-white) !important;
}

/* Partner Info - Jemné pozadí */
.partner-info {
    margin-top: 2rem !important;
}

.partner-info .d-flex {
    background-color: rgba(255, 255, 255, 0.9) !important;
    padding: 1rem 1.5rem !important;
    box-shadow: none !important;
    border: none !important;
}

/* ==========================================================================
   5. Buttons - Bez ostrých obrysů
   ========================================================================== */
.btn {
    border: none !important;
    padding: 1rem 2rem !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.btn-primary,
.btn-primary-contest {
    background-color: var(--ms-pink) !important;
    color: var(--ms-white) !important;
    box-shadow: none !important;
}

.btn-primary:hover,
.btn-primary-contest:hover {
    background-color: var(--ms-dark-blue) !important;
    color: var(--ms-white) !important;
    transform: translateY(-2px) !important;
}

.btn-secondary {
    background-color: var(--ms-turquoise) !important;
    color: var(--ms-white) !important;
}

.btn-secondary:hover {
    background-color: var(--ms-dark-blue) !important;
}

.btn-submit {
    background-color: var(--ms-turquoise) !important;
    color: var(--ms-white) !important;
    width: 100% !important;
    padding: 1.5rem !important;
    font-size: 20px !important;
}

/* Hero button - ensure full width */
.hero-image .btn {
    width: 100% !important;
}

.btn-submit:hover {
    background-color: var(--ms-dark-blue) !important;
}

/* ==========================================================================
   6. Sections - Jemné pozadí
   ========================================================================== */
.section {
    padding: 4rem 0 !important;
}

.section-secondary {
    background-color: rgba(255, 255, 255, 0.95) !important;
}

.section-primary {
    background-color: var(--ms-white) !important;
}

/* How To Section - Bílé pozadí */
.how-to-section {
    background-color: var(--ms-white) !important;
    border-top: none !important;
    padding: 4rem 0 !important;
    margin-bottom: 0 !important;
}

/* Step Cards - Růžové pozadí */
.step-card {
    background-color: var(--ms-pink) !important;
    padding: 2rem !important;
    height: 100% !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    border: none !important;
}

.step-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 5px 20px rgba(227, 127, 154, 0.3) !important;
}

.step-icon {
    width: 80px !important;
    height: 80px !important;
    background-color: rgba(255, 255, 255, 0.2) !important;
    color: var(--ms-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 36px !important;
    margin: 0 auto 1.5rem !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
    border: none !important;
}

.step-card:hover .step-icon {
    background-color: rgba(255, 255, 255, 0.3) !important;
    transform: scale(1.1) !important;
}

.step-card h4 {
    color: var(--ms-white) !important;
    font-weight: 700 !important;
    margin-bottom: 1rem !important;
    font-size: 22px !important;
}

.step-card p {
    color: var(--ms-white) !important;
    margin: 0 !important;
    opacity: 0.9 !important;
}

/* ==========================================================================
   7. Forms - Jemný design
   ========================================================================== */
.form-section {
    background: transparent !important; /* Průhledné pozadí */
    border-top: none !important;
    padding: 4rem 0 !important;
    margin-bottom: 0 !important; /* Odstraněn margin */
}

.form-container {
    background-color: var(--ms-white) !important;
    padding: 3rem !important;
    box-shadow: none !important;
    border: none !important;
}

.form-title {
    color: var(--ms-turquoise) !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    text-align: center !important;
    margin-bottom: 2rem !important;
}

.form-label {
    color: var(--ms-text-primary) !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 16px !important;
    margin-bottom: 0.5rem !important;
}

.form-control,
.form-select {
    border: 1px solid rgba(31, 179, 199, 0.3) !important;
    padding: 1rem !important;
    font-size: 16px !important;
    transition: all 0.3s ease !important;
    background-color: var(--ms-white) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--ms-turquoise) !important;
    box-shadow: 0 0 0 3px rgba(31, 179, 199, 0.1) !important;
    outline: none !important;
}

/* Upload Area - Jemný modrý nádech */
.upload-area {
    border: 2px dashed var(--ms-turquoise) !important;
    background-color: rgba(31, 179, 199, 0.05) !important;
    padding: 3rem !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.upload-area:hover {
    border-color: var(--ms-pink) !important;
    background-color: rgba(227, 127, 154, 0.05) !important;
}

.upload-area.dragover {
    border-color: var(--ms-pink) !important;
    background-color: rgba(227, 127, 154, 0.1) !important;
    border-style: solid !important;
}

.upload-icon {
    font-size: 48px !important;
    color: var(--ms-turquoise) !important;
    margin-bottom: 1rem !important;
}

/* Alerts - Jemné pozadí */
.alert {
    padding: 1rem !important;
    border: none !important;
    font-weight: 400 !important; /* Avenir Book */
    font-size: 16px !important;
    box-shadow: var(--ms-shadow-soft) !important;
}

.alert-info {
    background-color: rgba(31, 179, 199, 0.1) !important;
    color: var(--ms-dark-blue) !important;
}

/* ==========================================================================
   8. Prize Section - Střídavé růžové a modré pozadí
   ========================================================================== */
.prize-section {
    background-color: var(--ms-white) !important; /* Bílé pozadí */
    padding: 4rem 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.prize-card {
    background-color: var(--ms-white) !important;
    height: 100% !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
    position: relative !important;
    border: 1px solid var(--ms-pink) !important;
}

.prize-card:nth-child(1) {
    background-color: rgba(227, 127, 154, 0.05) !important;
}

.prize-card:nth-child(2) {
    background-color: rgba(31, 179, 199, 0.05) !important;
}

.prize-card:nth-child(3) {
    background-color: rgba(227, 127, 154, 0.05) !important;
}

.prize-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
}

.prize-image-fixed {
    height: 250px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
    background-color: rgba(255, 255, 255, 0.5) !important;
    border: none !important;
}

.prize-image-fixed img {
    max-height: 200px !important;
    width: auto !important;
    object-fit: contain !important;
}

.prize-card h3 {
    padding: 1.5rem 1.5rem 0.5rem !important;
    color: var(--ms-turquoise) !important;
    font-weight: 700 !important; /* Avenir Heavy */
    font-size: 24px !important;
}

.prize-card p {
    padding: 0 1.5rem 1.5rem !important;
    color: var(--ms-text-secondary) !important;
}

/* ==========================================================================
   9. Winners Section
   ========================================================================== */
.winners-section {
    background: transparent !important; /* Průhledné pozadí */
    padding: 4rem 0 !important;
    margin-top: 0 !important; /* Odstraněn margin */
}

.winners-placeholder {
    background-color: rgba(255, 255, 255, 0.9) !important; /* Bílé pozadí pro lepší kontrast */
    border: 2px dashed var(--ms-turquoise) !important;
    padding: 3rem !important;
    text-align: center !important;
    box-shadow: var(--ms-shadow-soft) !important;
}

.winners-placeholder h4 {
    color: var(--ms-text-primary) !important;
    font-weight: 700 !important;
}

.winners-placeholder p {
    color: var(--ms-text-primary) !important;
    font-weight: 600 !important; /* Tmavší text */
}

.winners-icon {
    width: 100px !important;
    height: 100px !important;
    background-color: var(--ms-pink) !important;
    color: var(--ms-white) !important;
    margin: 0 auto 2rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 48px !important;
    box-shadow: none !important;
    border: none !important;
}

/* Winners Grid - když jsou výherce */
.winners-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 2rem !important;
    margin-top: 2rem !important;
}

.winner-card {
    background-color: var(--ms-white) !important;
    padding: 2rem !important;
    text-align: center !important;
    box-shadow: var(--ms-shadow-soft) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
    border: 1px solid rgba(31, 179, 199, 0.2) !important;
}

.winner-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--ms-shadow-large) !important;
    border-color: var(--ms-pink) !important;
}

/* Dekorativní proužek nahoře */
.winner-card::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, var(--ms-pink) 0%, var(--ms-turquoise) 100%) !important;
}

.winner-icon {
    width: 80px !important;
    height: 80px !important;
    background-color: rgba(227, 127, 154, 0.1) !important;
    color: var(--ms-pink) !important;
    margin: 0 auto 1.5rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 36px !important;
    transition: all 0.3s ease !important;
}

.winner-card:hover .winner-icon {
    background-color: var(--ms-pink) !important;
    color: var(--ms-white) !important;
    transform: scale(1.1) !important;
}

.winner-name {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 700 !important;
    font-size: 22px !important;
    color: var(--ms-text-primary) !important;
    margin-bottom: 0.5rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.winner-prize {
    font-family: 'Avenir', sans-serif !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    color: var(--ms-text-secondary) !important;
    margin: 0 !important;
    padding: 0 1rem !important;
}

/* Střídavé barvy karet */
.winner-card:nth-child(odd) .winner-icon {
    background-color: rgba(31, 179, 199, 0.1) !important;
    color: var(--ms-turquoise) !important;
}

.winner-card:nth-child(odd):hover .winner-icon {
    background-color: var(--ms-turquoise) !important;
    color: var(--ms-white) !important;
}

/* Responzivní design pro mobily */
@media (max-width: 768px) {
    .winners-grid {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }
    
    .winner-card {
        padding: 1.5rem !important;
    }
    
    .winner-icon {
        width: 70px !important;
        height: 70px !important;
        font-size: 30px !important;
    }
    
    .winner-name {
        font-size: 20px !important;
    }
    
    .winner-prize {
        font-size: 15px !important;
    }
}

/* ==========================================================================
   10. Footer - Tyrkysové pozadí
   ========================================================================== */
.contest-footer {
    background-color: var(--ms-turquoise) !important;
    color: var(--ms-white) !important;
    padding: 3rem 0 !important;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1) !important;
}

.contest-footer i {
    color: var(--ms-white) !important;
}

.contest-footer a {
    color: var(--ms-white) !important;
    text-decoration: none !important;
    transition: opacity 0.3s ease !important;
}

.contest-footer a:hover {
    opacity: 0.8 !important;
}

.contest-footer hr {
    border: none !important;
    height: 1px !important;
    background-color: rgba(255, 255, 255, 0.2) !important;
}

.contest-footer .small {
    color: rgba(255, 255, 255, 0.8) !important; /* Světlejší text v patičce */
    text-align: center !important;
    margin-top: 0 !important;
}

/* ==========================================================================
   11. Scroll to Top - Růžové tlačítko
   ========================================================================== */
.scroll-to-top {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    width: 50px !important;
    height: 50px !important;
    background-color: var(--ms-pink) !important;
    color: var(--ms-white) !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    cursor: pointer !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: all 0.3s ease !important;
    z-index: 1000 !important;
    box-shadow: var(--ms-shadow-medium) !important;
}

.scroll-to-top.visible {
    opacity: 1 !important;
    visibility: visible !important;
}

.scroll-to-top:hover {
    background-color: var(--ms-dark-blue) !important;
    transform: translateY(-3px) !important;
}

/* ==========================================================================
   12. Modals - Jemný design
   ========================================================================== */
.modal-content {
    border: none !important;
    box-shadow: var(--ms-shadow-large) !important;
}

.modal-header {
    background-color: var(--ms-turquoise) !important;
    color: var(--ms-white) !important;
    border-bottom: none !important;
}

.modal-title {
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

.modal-footer {
    border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
    background-color: rgba(227, 127, 154, 0.03) !important;
}

/* ==========================================================================
   13. Responsive Design
   ========================================================================== */
@media (max-width: 768px) {
    /* Hero image na mobilu */
    .hero-image .hero-logo {
        max-width: 280px !important; /* Menší šířka na mobilu */
        margin: 2rem auto !important; /* Větší padding nahoře a dole */
    }
    
    .hero-image {
        padding: 1rem 1rem !important; /* Odsunutí od okrajů + vertikální padding */
    }
    h1, .hero-title {
        font-size: 62px !important; /* Zvětšeno o 30% z 48px */
    }
    
    .hero-line-1 {
        font-size: 55px !important; /* Zvětšeno o 30% z 42px */
    }
    
    .hero-line-1 .text-blue {
        font-size: 27px !important; /* Zvětšeno o 30% z 21px */
    }
    
    .hero-line-2 {
        font-size: 42px !important; /* Zvětšeno o 30% z 32px */
        margin-left: 1rem !important;
    }
    
    .hero-line-3 {
        font-size: 49px !important; /* Zvětšeno o 30% z 38px */
        margin-left: 2rem !important;
    }
    
    /* Logo v hero na mobilu */
    .hero-logo-text {
        height: 70px !important;
        margin: 0rem !important;
    }
    
    h2, .section-title {
        font-size: 24px !important;
    }
    
    /* Prize list na mobilu - pyramida layout pomocí CSS Grid */
    .prize-list {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        grid-template-rows: auto auto !important;
        gap: 0.75rem !important;
        margin: 0 !important;
        padding: 0 !important;
        justify-items: center !important;
    }
    
    /* První položka - přes 2 sloupce nahoře */
    .prize-item:first-child {
        grid-column: 1 / -1 !important;
        width: 60% !important;
        margin: 0 !important;
    }
    
    /* Druhá a třetí položka - každá v jednom sloupci */
    .prize-item:nth-child(2),
    .prize-item:nth-child(3) {
        width: 90% !important;
        margin: 0 !important;
    }
    
    .prize-item {
        padding: 0.75rem 0.5rem !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        min-height: 85px !important;
    }
    
    .prize-count {
        font-size: 36px !important; /* Ještě menší na mobilu */
    }
    
    /* Prize list na mobilu - menší line height */
    .prize-item small {
        line-height: 1.1 !important;
        font-size: 12px !important;
    }
    
    /* Patička na mobilu - vše doleva */
    .contest-footer .row > div {
        text-align: left !important;
        margin-bottom: 1.5rem !important;
    }
    
    .contest-footer .text-center {
        text-align: left !important;
    }
    
    .contest-footer .text-end {
        text-align: left !important;
    }
    
    .contest-footer .d-flex {
        justify-content: flex-start !important;
    }
    
    .contest-footer .footer-links {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    
    .hero-section {
        padding: 3rem 0 !important;
    }
    
    .form-container {
        padding: 1.5rem !important;
    }
}

@media (max-width: 480px) {
    /* Ještě menší obrázek na malých mobilech */
    .hero-image .hero-logo {
        max-width: 220px !important;
    }
    
    /* Upravení mezery kolem obrázku */
    .hero-image {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important;
    }
}

/* ==========================================================================
   14. Utility Classes
   ========================================================================== */
.text-muted {
    color: var(--ms-text-secondary) !important;
}

.lead {
    font-size: 18px !important;
    font-weight: 400 !important; /* Avenir Book */
    line-height: 1.6 !important;
}

/* Remove Bootstrap defaults */
.rounded,
.rounded-0,
.rounded-1,
.rounded-2,
.rounded-3,
.rounded-circle,
.rounded-pill {
    border-radius: 0 !important;
}

/* Jemné stíny */
.shadow-sm {
    box-shadow: var(--ms-shadow-soft) !important;
}

.shadow {
    box-shadow: var(--ms-shadow-medium) !important;
}

.shadow-lg {
    box-shadow: var(--ms-shadow-large) !important;
}