/* Reset and Base Styles */
@font-face {
    font-family: 'Dessert Script';
    src: url('../fonts/DessertScript/DessertScript.eot');
    src: url('../fonts/DessertScript/DessertScript.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DessertScript/DessertScript.woff2') format('woff2'),
        url('../fonts/DessertScript/DessertScript.woff') format('woff'),
        url('../fonts/DessertScript/DessertScript.ttf') format('truetype'),
        url('../fonts/DessertScript/DessertScript.svg#DessertScript') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../fonts/PT-Sans/PTSans-BoldItalic.eot');
    src: url('../fonts/PT-Sans/PTSans-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PT-Sans/PTSans-BoldItalic.woff2') format('woff2'),
        url('../fonts/PT-Sans/PTSans-BoldItalic.woff') format('woff'),
        url('../fonts/PT-Sans/PTSans-BoldItalic.ttf') format('truetype'),
        url('../fonts/PT-Sans/PTSans-BoldItalic.svg#PTSans-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../fonts/PT-Sans/PTSans-Italic.eot');
    src: url('../fonts/PT-Sans/PTSans-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PT-Sans/PTSans-Italic.woff2') format('woff2'),
        url('../fonts/PT-Sans/PTSans-Italic.woff') format('woff'),
        url('../fonts/PT-Sans/PTSans-Italic.ttf') format('truetype'),
        url('../fonts/PT-Sans/PTSans-Italic.svg#PTSans-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../fonts/PT-Sans/PTSans-Bold.eot');
    src: url('../fonts/PT-Sans/PTSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PT-Sans/PTSans-Bold.woff2') format('woff2'),
        url('../fonts/PT-Sans/PTSans-Bold.woff') format('woff'),
        url('../fonts/PT-Sans/PTSans-Bold.ttf') format('truetype'),
        url('../fonts/PT-Sans/PTSans-Bold.svg#PTSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../fonts/PT-Sans/PTSans-Regular.eot');
    src: url('../fonts/PT-Sans/PTSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/PT-Sans/PTSans-Regular.woff2') format('woff2'),
        url('../fonts/PT-Sans/PTSans-Regular.woff') format('woff'),
        url('../fonts/PT-Sans/PTSans-Regular.ttf') format('truetype'),
        url('../fonts/PT-Sans/PTSans-Regular.svg#PTSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


html {
  font-size: clamp(12px, 1vw, 16px);
}

@media (max-width: 1366px) {
  html { font-size: 1.75vw; }
}

@media (max-width: 480px) {
  html { font-size: 4.5vw; }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "PT Sans", 'Arial', sans-serif;
    line-height: 1.6;
    font-size: 1rem;
    color: #2E2925;
    background: #fff;
}

button,
input {
    font-family: "PT Sans", 'Arial', sans-serif;

}

._mobile {
    display: none !important;
}

._desk {
    display: block;
}

/* Container */
.container {
    width: 88.125rem;
    margin: 0 auto;
    padding: 0 1.25rem;
    max-width: 100%;
}

img {
    max-width: 100%;
}

.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: #E42261;
    border: none;
    color: white;
    border: none;
    padding: 2.222vh 5.926vh;
    border-radius: 4rem;
    font-size: 3.333vh;
    line-height: 1.2;
    font-weight: 600;
    font-style: italic;
    font-family: "PT Sans", 'Arial', sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    z-index: 1;
}
.btn:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: calc(100% + 0.125rem);
    height: calc(100% + 0.125rem);
    display: block;
    border-radius: 4rem;
    background: linear-gradient(to top, #E42261 5%, #FFFFFF);
    z-index: -1;
}
.btn:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 4rem;
    background: #E42261;
    z-index: -1;

}

.btn:hover {
    background: #FF276D;
    transform: translateY(-0.125rem);
    box-shadow: 0 0.5rem 1.5625rem rgba(233, 26, 133, 0.4);
}

.btn:disabled {
    background: #2E2925;
    cursor: not-allowed;
}

.btn:disabled:before {
    background: #ccc;
}

.btn:disabled:after {
    background: #ccc;
}

.btn:disabled:hover {
    background: #ccc;
    transform: none;
    box-shadow: none;
}

.btn--md {
    height: 4.25rem;
    font-size: 1.5rem;
}

.btn--lg {
    height: 5rem;
    font-size: 1.5rem;
}

/* Header */
.header {
    background: rgba(255, 255, 255, 0.95);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    padding: 0.5rem 0 0.5rem;
}

.nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1.25rem;
}

.nav-logo .logo {
    height: 3.625rem;
    display: block;
}
.nav-menu {
    flex: auto;
    display: flex;
}
.nav-menu__list {
    display: flex;
    list-style: none;
    margin: auto;
    gap: 3.175rem;
}

.nav-menu__list a {
    text-decoration: none;
    color: #2E2925;
    font-style: italic;
    font-weight: bold;
    font-size: 1.5rem;
    transition: color 0.3s ease;
}

.nav-menu__list a:hover {
    color: #e91a85;
}

.personal-cabinet {
    /* button */

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    width: 14.688rem;
    height: 3.25rem;
    color: #2C2A25;
    background: #FFDDE3;
    border-radius: 1.875rem;
    font-size: 1.5rem;
    font-weight: bold;
    font-family: inherit;
    font-style: italic;
    border: none;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: 0.3s ease;
}

.personal-cabinet:hover {
    background: #FF276D;
    color: #FFF;
}

/* Hamburger Menu */
.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
    padding: 0.5rem;
    z-index: 1001;
}

.hamburger span {
    width: 27px;
    height: 3px;
    background: #FFFFFF;
    margin: 2.5px 0;
    transition: 0.3s;
    border-radius: 2px;
}

.hamburger.active span:nth-child(1) {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.hamburger.active span:nth-child(2) {
    opacity: 0;
}

.hamburger.active span:nth-child(3) {
    transform: rotate(45deg) translate(-5px, -6px);
}

.hamburger.dark span {
    background: #2C2A25;
}

/* Hero Section */
.hero {
    position: relative;
    background: url('../images/hero-bg.png') no-repeat center bottom;
    background-size: 100%;
    position: relative;
    overflow: hidden;
}
.hero::before {
    content: '';
    position: absolute;
    bottom: 5%;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: url('../images/chef.png') no-repeat bottom right 12%;
    background-size: auto 80%;

}
.hero::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: url('../images/decor.png') no-repeat bottom left;
    background-size: 100%;
}
.hero .container {
    position: relative;
    z-index: 1;
}

@keyframes float {
    0% { transform: translateY(0) translateX(0); }
    50% { transform: translateY(-1.25rem) translateX(0.625rem); }
    100% { transform: translateY(0) translateX(0); }
}


.hero-content {
    padding-top: 8rem;
}

.hero-left {
    position: relative;
}

.gift-icon {
    position: absolute;
    top: 1.25rem;
    left: -3.5rem;
    width: 10vh;
    animation: bounce 2s infinite;
}
.gift-icon._bottom {
    top: 46vh;
    left: 25vw;
    width: 17vh;
    animation-duration: 3s;
}

@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-0.625rem); }
}

.gift-icon img {
    width: 100%;
    height: 100%;
}

.hero-title {
    height: 25.374vh;
    margin-left: 1.4%;
    margin-bottom: 1.8rem;
}

.hero-subtitle {
    font-size: 3.704vh;
    margin-left: 13.75rem;
    margin-bottom: 2.87vh;
    font-style: italic;
    color: #2E2925;
}

.steps {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6vh;

    
}

.step {
    display: flex;
    align-items: center;
    gap: 2.922vh;
}

.step-number {
    font-family: 'Dessert Script', 'Arial',sans-serif; 
    font-style: italic;
    color: #E42261;
    flex-shrink: 0;
    width: 2.5rem;
    font-weight: bold;
    font-size: 7.407vh;
    line-height: 1;
}

.step-text {
    font-size: 2.622vh;
    line-height: 1;
    font-weight: bold;
    font-style: italic;
}
.step-text strong {
    color: #E42261;
}

.btn-register {
    margin: 0px 2.963vh;
    font-size: 2.6vh;
    z-index: 1;
}

.main-prize {
    width: 58.574vh;
    margin-left: -1.875rem;
}

.prize-label {
    display: block;
    font-size: 1.1rem;
    color: #2E2925;
    margin-bottom: 0.3125rem;
}

.prize-amount {
    font-size: 3rem;
    font-weight: bold;
    color: #e91a85;
    text-shadow: 0.125rem 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
}

.hero-right {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chef-image {
    position: relative;
    z-index: 2;
}

.chef-image img {
    max-width: 25rem;
    height: auto;
}

.recommendation {
    position: absolute;
    top: 1.25rem;
    right: -3.125rem;
    background: white;
    padding: 0.9375rem 1.25rem;
    border-radius: 3.125rem;
    box-shadow: 0 0.3125rem 1.25rem rgba(0, 0, 0, 0.1);
    text-align: center;
    min-width: 7.5rem;
}

.renat {
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
    color: #e91a85;
}

.surname {
    display: block;
    font-size: 1rem;
    color: #2E2925;
    margin: 0.125rem 0;
}

.recommends {
    display: block;
    font-size: 0.8rem;
    color: #666;
    font-weight: 600;
}

.product-image {
    position: absolute;
    bottom: 3.125rem;
    right: -1.25rem;
    z-index: 3;
}

.product-image img {
    max-width: 12.5rem;
    height: auto;
}

/* Prizes Section */
.prizes {
    padding: 4rem 1.25rem 5.2rem;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFCFDA 100%);
}

.prizes-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2.5rem;
    font-size: 1.5rem;
    text-align: center;

}

.prize-card {
    background: white;
    text-align: center;
    font-style: italic;
    border-radius: 1.25rem;
    padding: 1.4375rem 1.25rem 1rem;
    text-align: center;
    box-shadow: 0 0.625rem 1.875rem rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.prize-card:hover {
    transform: translateY(-0.3125rem);
    box-shadow: 0 0.9375rem 2.5rem rgba(0, 0, 0, 0.15);
}

.prize-card h3 {
    font-size: 2rem;
    margin-bottom: 1.8rem;
    line-height: 2rem;
    color: #DE0005;
    font-weight: bold;
}

.main-prize-card {
    transform: scale(1.05);
}

.main-prize-card h3 {
    font-size: 2.25rem;
    line-height: 2rem;
}

.main-prize-amount .amount {
    font-size: 2rem;
    font-weight: bold;
    display: block;
}

.main-prize-amount .currency {
    font-size: 2.5rem;
    display: block;
    margin-top: -0.5125rem;
}

.prize-content img {
    max-width: 100%;
    height: auto;
    margin-bottom: 0.625rem;
}
.prize-content p {
    font-weight: bold;
    line-height: 1.3;
}
.prize-info {
    text-align: left;
}

.prize-info ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.prize-info li {
    padding-left: 1.8rem;
    position: relative;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1.45;
    color: #2E2925;
}
.prize-info li small {
    font-weight: normal;
    font-size: 1.25rem;
}
.prize-info li::before {
    content: '•';
    color: #DE0005;
    position: absolute;
    left: 0;
    font-weight: bold;

}

.prize-value {
    font-size: 2.5rem;
    font-weight: bold;
    color: #2E2925;
    margin-top: 1rem;
}

.more-prizes {
    text-align: center;
    margin-top: 2.125rem;
}

.btn-more-prizes {
    display: block;
    width: max-content;
    margin: 0 auto;
    background: #E42261;
    color: white;
    padding: 0.75rem 1.875rem;
    border-radius: 1.5625rem;
    font-size: 1.25rem;
    text-decoration: none;
    font-style: italic;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-more-prizes:hover {
    background: #FF276D;
    transform: translateY(-0.125rem);
    box-shadow: 0 0.5rem 1.5625rem rgba(233, 26, 133, 0.4);
}

/* Contest Section */
.contest {
    background: url('../images/contest-bg.png') no-repeat center center;
    background-size: cover;
    position: relative;
    color: #FFF;
}

.chef-small {
    width: 21.1875rem;
    display: block;
}
.contest-content {
    display: flex;
    gap: 2.5rem;
    align-items: center;
    font-style: italic;
}

.contest-tg {
    display: flex;
    align-items: center;
    margin-bottom: 0.7rem;
    padding: 0.375rem 0.75rem 0.375rem 0.5rem;
    width: max-content;
    background: #FFF;
    border-radius: 6.25rem;
    color: #E42261;
    font-weight: bold;
    font-style: italic;
    font-size: 1.875rem;
    line-height: 1;
    text-decoration: none;
}

.contest-tg img {
    width: 1.75rem;
    margin-right: 0.5rem;
}

.contest-right {
    display: flex;
    align-items: center;
    flex: auto;
}
.contest-right h2 {
    font-size: 1.875rem;
    line-height: 1;
    margin-bottom: 1rem;
}

.contest-description {
    font-size: 1.875rem;
    font-weight: bold;font-style: italic;
    margin-bottom: 0.9375rem;
    line-height: 1.1;
}

.contest-dates {
    font-size: 1.5rem;
    font-style: italic;
}

.btn-participate {
    margin-left: auto;
}

.strawberry-icon {
    position: absolute;
    top: -1.25rem;
    right: 3.125rem;
    width: 3.75rem;
    height: 3.75rem;
}

.strawberry-icon img {
    width: 100%;
    height: 100%;
}

/* Where to Buy Section */
.where-to-buy {
    padding: 4.688rem 0;
}

.where-content {
    display: flex;
    text-align: center;
    justify-content: center;
    width: max-content;
    margin: auto;
    align-items: center;
    padding: 1.875rem 5rem;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFCFDA 100%);
    border-radius: 3.125rem;

}

.where-content h2 {
    margin-right: 3.125rem;
    font-size: 1.875rem;
    color: #2E2925;
    font-weight: bold;
    font-style: italic;
}

.stores {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3.125rem;
    flex-wrap: wrap;
}
.stores__link {
    position: relative;
}
.stores__link:before{
    content: '';
    width: 60%;
    height: 60%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    box-shadow: 0px 15px 40px 0px #E4226180;
    transition: opacity 0.3s ease;
    opacity: 0;
    zoom: 1;
}
.stores__link:hover:before{
    opacity: 1;
}

.stores img {
    position: relative;
    height: 4.125rem;
    max-width: 13.938rem;
    object-fit: contain;
    z-index: 1;
}
.stores__link:first-child img{
    height: 6.563rem;
}

/* Video Section */
.video-section {
    position: relative;
    padding: 11.5rem 1.25rem 5rem;
    position: relative;
}

.video-section::before {
    content: '';
    position: absolute;
    top: 0%;
    left: 0;
    transform: translateY(-37%);
    width: 100%;
    height: 100%;
    display: block;
    background: url(../images/chocolate-piece.png) no-repeat center;
    background-size: 100%;
    pointer-events: none;
}

.video-container {
    position: relative;
}

.video-wrapper {
    position: relative;
    background: url('../images/video-bg.png') no-repeat center;
    background-size: cover;
    border-radius: 1.25rem;
    padding: 2.5rem;
    box-shadow: 0 0.9375rem 2.1875rem rgba(0, 0, 0, 0.1);
}

.video-placeholder {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 4.5rem);
    height: calc(100% - 4.5rem);
    border-radius: 0.5rem;
    object-fit: cover;
    pointer-events: none;
    z-index: 0;
}

.video-section video,
.video-section iframe{
    width: 100%;
    height: 45.35rem;
    border-radius: 0.9375rem;
    background: #000;
    cursor: pointer;
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10.438rem;
    transform: translate(-50%, -50%);
    cursor: pointer;
    transition: 0.3s ease;
    z-index: 1;
}

.play-button:hover {
    opacity: 0.8;
}


/* Footer */
.footer {
    margin-top: 10.7rem;
    position: relative;
    background: #FBEBEC;
    padding: 0 0 1.875rem;
}

.footer::before {
    content: '';
    position: absolute;
    bottom: 99%;
    left: 0;
    display: block;
    width: 100%;
    height: 17.188vw;
    background: url('../images/footer-bg.png') no-repeat center bottom;
    background-size: 100%;
    pointer-events: none;
    z-index: 1;
}

.footer-content {
    display: grid;
    grid-template-columns: 0.4fr auto 0.5fr;
    gap: 2.5rem;
    align-items: start;
}

.footer-left {
    padding-top: 3.1rem;
    padding-right: 2rem;
}

.footer-left .company-info h3 {
    font-size: 1.125rem;
    margin-bottom: 0.2375rem;
    color: #2E2925;
    font-weight: bold;
    font-style: italic;
    line-height: 1.2;
}

.footer-left .company-info p {
    font-size: 0.875rem;
    line-height: 1;
    margin-bottom: 0.3125rem;
    color: #2E2925;
}

.footer-left .contact-info {
    margin-top: 2rem;
}

.footer-left .contact-info .email-label {
    font-size: 1.313rem;
    line-height: 1;
    color: #2E2925;
    margin-bottom: 0.25rem;
    font-style: italic;
    font-weight: bold;
}

.footer-left .contact-info .email-link {
    display: block;
    color: #e91a85;
    text-decoration: none;
    line-height: 1;
    font-size: 1.313rem;
    margin-bottom: 0.8rem;
    font-weight: bold;
    font-style: italic;
}

.footer-left .contact-info .email-link:hover {
    color: #FF276D;
}

.footer-left .contact-info .contact-link {
    color: #e91a85;
    text-decoration: underline;
    font-size: 1.313rem;
    font-style: italic;
    font-weight: bold;
}

.footer-left .contact-info .contact-link:hover {
    color: #FF276D;
}

.footer-center {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.konti-logo {
    margin-top: 2.1rem;
    margin-bottom: 1rem;
}

.konti-logo img {
    max-width: 13.063rem;
    height: auto;
}

.rights-text {
    font-size: 1.125rem;
    color: #2E2925;
    margin: 0;
}

.footer-right {
    text-align: right;
    padding-left: 2rem;
}

.social-links {
    margin-bottom: 1.95rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.social-links p {
    font-size: 1.313rem;
    line-height: 1;
    font-weight: bold;
    font-style: italic;
    color: #2E2925;
    margin: 0 1.563rem 0 0;
}

.vk-link img {
    width: 2.313rem;
    height: 2.313rem;
}

.legal-text {
    text-align: right;
}

.legal-text p {
    font-size: 0.875rem;
    line-height: 1.2;
    color: #666;
    margin-bottom: 1rem;
    text-align: right;
}

.rules-link {
    color: #e91a85;
    text-decoration: underline;
    font-size: 1.313rem;
    display: block;
    font-weight: bold;
    font-style: italic;
    margin-bottom: 0.5rem;
    text-align: right;
}

.rules-link:hover {
    color: #FF276D;
}

.legal-links {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.legal-links a {
    text-decoration: underline;
    font-size: 0.875rem;
    line-height: 1.4;
    text-align: right;
    font-style: italic;
    color: #2E2925;
}
.legal-links a:hover {
    color: #FF276D;
}

.footer a:hover {
    text-decoration: underline;
}

/* Page */

.page {
    padding-top: 10.85rem;
    background: url('../images/page-bg.png') no-repeat center top;
    background-size: 100%;
}

.page-content {
    width: 89vw;
    max-width: 100%;
    padding: 4.375rem 2.188rem;
    margin: auto;
    background: #FFF;
    border-radius: 0.938rem;
}

.page-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 2.8rem;
    position: relative;
}

.page-title {
    font-family: 'Dessert Script', 'Arial',sans-serif;
    font-style: italic;
    font-size: 4rem;
    color: #E42261;
    line-height: 1;
    margin-bottom: 2rem;
    font-style: italic;
}

.page-title:only-child {
    margin-bottom: 3.25rem;
}

.page-title--gigant {
    font-size: 19.75rem;
    line-height: 1;
    font-weight: 400;
}

.page-subtitle {
    font-size: 2rem;
    color: #000000;
    font-style: italic;
    font-weight: bold;
    margin-bottom: 1rem;
}

.page-header__text {
    max-width: 65%;
    color: #5E5E5E;
    font-size: 2rem;
    font-weight: bold;
    font-style: italic;
    line-height: 1.1;
}

.page-header .btn {
    margin-top: 4rem;
    width: 17.5rem;
    max-width: 100%;
}

/* Responsive Design */

@media (max-width: 820px) {
    /* Better button spacing */
    .btn {
        font-size: 1rem;
        padding: 0.8rem 1.5rem;
    }

    .btn--md {
        font-size: 1.5rem;
    }
    /* Header */
    .header {
        padding: 0.5rem 0;
        background: none;
    }
    
    .nav {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 0;
        padding: 0 1rem;
        position: relative;
    }
    
    .hamburger {
        display: flex;
        order: 2;
    }
    
    .nav-logo {
        order: 1;
        z-index: 10000;
    }
    
    .nav-logo .logo {
        height: 2.625rem;
    }
    
    .personal-cabinet {
        order: 3;

        font-size: 1.5rem;
    }
    
    .nav-menu {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100vh;
        background: white;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2rem;
        transition: left 0.3s ease;
        z-index: 1000;
        padding: 0;
        margin: 0;
        box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
    }
    
    .nav-menu.active {
        left: 0;
    }
    
    .nav-menu__list {
        flex-direction: column;
        gap: 0px;
        margin: 0;
        text-align: center;
    }

    .nav-menu__list li {
        list-style: none;
        margin: 0;
    }
    
    .nav-menu__list a {
        font-size: 1.5rem;
        color: #2E2925;
        text-decoration: none;
        font-weight: bold;
        font-style: italic;
        padding: 1rem 2rem;
        display: block;
        text-align: center;
        transition: color 0.3s ease;
        white-space: nowrap;
    }
    
    .nav-menu a:hover {
        color: #e91a85;
    }
    
    /* Hero Section */
    .hero {
        min-height: auto;
    }
    
    .hero-content {
        gap: 2rem;
        padding-top: 2rem;
    }
    
    .hero-title {
        height: auto;
        width: 35vw;
        margin: 0 auto 0 10rem;
    }
    
    .hero-subtitle {
        font-size: 1.2rem;
        margin-left: 13.75rem;
        margin-bottom: 0;
    }
    
    .steps {
        margin: 0 auto;
        gap: 0.5rem;
        max-width: 90%;
    }
    
    .step {
        gap: 1rem;
        text-align: left;
        align-items: center;
        max-width: 100%;
    }
    
    .step-number {
        font-size: 3rem;
        flex-shrink: 0;
    }
    
    .step-text {
        font-size: 1rem;
        line-height: 1.3;
    }
    
    .btn-register {
        margin: 0 auto 0;
        font-size: 1rem;
        padding: 1rem 2rem;
        display: block;
        width: fit-content;
    }
    .btn-register._mobile {
        display: none;
    }
    
    .main-prize {
        width: 30vw;
    }
    
    .gift-icon {
        display: none;
    }
    
    /* Prizes Section */
    .prizes {
        padding: 2rem 1rem;
    }
    
    .prize-card h3 {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }
    
    .prize-value {
        font-size: 1.8rem;
    }
    
    .main-prize-amount .currency {
        font-size: 1.8rem;
    }
    
    .prize-info li {
        font-size: 1rem;
        padding-left: 1.2rem;
    }
    
    /* Contest Section */

    .contest-content {
        padding: 1rem 0 0;
    }

    .contest-right {
        flex-direction: column;
        align-items: flex-start;
    }

    .contest__inner {
        margin-bottom: 1rem;
    }
    .btn-participate {
        margin-left: 0;
    }
    
    /* Where to Buy */
    .where-content {
        padding: 1.5rem 2rem;
        gap: 1.5rem;
    }
    
    .where-content h2 {
        margin: 0;
        font-size: 1.3rem;
    }
    
    .stores {
        gap: 1.5rem;
    }
    
    .stores img {
        height: 3rem;
    }
    
    .stores__link:first-child img {
        height: 4rem;
    }
    
    /* Video Section */
    .video-section {
        padding: 8rem 1rem 2rem;
    }
    .video-placeholder {
        width: calc(100% - 0.7rem);
        height: calc(100% - 0.7rem);
    }
    
    .video-section video,
    .video-section iframe {
        height: 18rem;
    }
    
    .play-button {
        width: 6rem;
    }
    
    /* Footer */
    .footer {
        margin-top: 10rem;
    }
    
    .footer-left .company-info h3 {
        font-size: 1rem;
    }
    
    .footer-left .company-info p {
        font-size: 0.8rem;
    }
    
    .footer-left .contact-info .email-label,
    .footer-left .contact-info .email-link,
    .footer-left .contact-info .contact-link {
        font-size: 1rem;
    }
    
    .konti-logo img {
        max-width: 10rem;
    }
    
    .rights-text {
        font-size: 1rem;
    }
    
    .social-links p {
        font-size: 1rem;
    }
    
    .vk-link img {
        width: 2rem;
        height: 2rem;
    }
    
    .legal-text p {
        font-size: 0.8rem;
    }
    
    .rules-link {
        font-size: 1rem;
    }
    
    .legal-links a {
        font-size: 0.8rem;
    }

    .page-content {
        width: 96vw;
        padding: 1rem;
    }

    .prizes-container {
        gap: 1rem;
        font-size: 1rem;
    }
    .btn--lg {
        height: 3.75rem;
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    ._mobile {
        display: block !important;
    }

    ._desk {
        display: none;
    }

    /* Header */
    .header {
    }

    .page {
        padding-top: 5.2rem;
        background-size: 450%;
    }

    .page-header {
        margin-bottom: 1.6rem;
    }
    .page-content {
        width: 91vw;
        padding: 1rem;
    }

    .page-title {
        margin-bottom: 0.15rem;
        font-size: 2.5rem;
    }

    .page-title:only-child {
        margin-bottom: 4.063rem;
    }

    .page-title--gigant {
        font-size: 9.813rem;
    }

    .page-header__text {
        max-width: 90%;
        font-size: 1.125rem;
    }

    .page-header .btn {
        margin-top: 2rem;
    }

    .page-subtitle {
        font-size: 1.2rem;
        line-height: 1.1;
        margin-bottom: 0.6rem;
    }
    
    .btn--lg {
        height: 3.75rem;
        font-size: 1.25rem;
    }

    .btn--md {
        height: 3.75rem;
        font-size: 1.25rem;
    }
    .nav {
        padding: 0 1rem;
    }
    
    .personal-cabinet {
        font-size: 1rem;
        padding: 0.6rem 1.2rem;
        width: auto;
    }
    
    .nav-logo .logo {
        height: 2.2rem;
    }
    
    .nav-menu__list a {
        font-size: 1.3rem;
        padding: 0.5rem 2rem;
    }
    
    /* Hero */
    .hero {
        background: url('../images/hero-bg-m.png') no-repeat center bottom;
        background-size: 100%;
        min-height: auto;
    }
    .hero:after,
    .hero:before {
        display: none;
    }
    
    .hero-content {
        padding-top: 3rem;
        gap: 1.5rem;
    }
    
    .hero-title {
        width: 76%;
        display: block;
        margin: 0 auto 0.8rem ;
    }
    
    .hero-subtitle {
        display: none;
        font-size: 1rem;
        text-align: center;
        margin-bottom: 2rem;
    }

    .steps {
        width: 62%;
        margin: 0 auto;
        gap: 0.4rem;
        align-items: flex-start;
    }
    
    .step {
        align-items: center;
        gap: 1rem;
    }
    
    .step .btn {
        display: none;
    }

    .step-number {
        width: 1.563rem;
        font-size: 3.125rem;
        flex-shrink: 0;
        line-height: 1;
    }
    
    .step-text {
        font-size: 1rem;
        line-height: 1.1;
    }
    
    .btn-register {
        font-size: 1rem;
        padding: 1rem 2.5rem;
        margin: 1.4rem auto 0;
        width: fit-content;
    }
    .btn-register._mobile {
        display: block;
    }
    
    .main-prize {
        width: 87vw;
        margin: 15.2rem auto 0px;
    }
    
    /* Prizes */
    .prizes {
        padding: 1.5rem 0rem 4rem;
    }
    .prizes-container {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        font-size: 1.5rem;
    }
    
    .prize-card {
        padding: 1rem 1.3rem 2rem;
        margin-bottom: 0rem;
        height: 26.625rem;
    }
    
    .prize-card h3 {
        font-size: 1.5rem;
        margin-bottom: 1.2rem;
    }

    .prize-content p {
        font-size: 1.15rem;
    }
    
    .prize-value {
        font-size: 1.8rem;
        line-height: 1;
    }
    
    .main-prize-amount .currency {
        font-size: 1.9rem;
        margin-top: 0.5rem;
        line-height: 1;
    }
    
    .prize-info li {
        font-size: 1.1rem;
        line-height: 1.5;
        padding-left: 1.2rem;
    }
    
    .prize-info li small {
        font-size: 0.8rem;
    }
    
    /* Contest */
    .contest {
        padding: 0;
        background: #EF5382 url('../images/contest-bg-m.png') no-repeat center bottom;
        background-size: 100%;
    }
    
    .contest-content {
        padding: 1.088rem 0 1.8rem;
        gap: 1.5rem;
    }
    
    .chef-small {
        width: 12rem;
        display: none;
    }
    
    .contest-left {
        display: none;
    }
    .contest-right {
        width: 55%;
        flex-grow: 0;
        margin-left: auto;
        text-align: left;
        align-items: flex-start;
    }
    
    .contest__inner {
        margin-bottom: 1.8rem;
        text-align: left;
    }

    .contest-right h2 {
        margin-bottom: 0;
        font-size: 1rem;
        line-height: 0.9;
    }
    
    .contest-tg {
        font-size: 0.75rem;
        padding: 0.25rem;
        margin: 0.2rem 0;
    }
    .contest-tg img{
        width: 0.625rem;
    }
    .contest-description {
        margin-bottom: 0.5rem;
        font-size: 1rem;
        line-height: 0.8;
        text-align: left;

    }
    
    .contest-dates {
        font-size: 0.625rem;
        line-height: 1;
        text-align: left;

    }
    
    .btn-participate {
        width: 100%;
        font-size: 0.9rem;
        padding: 0.8rem 1.5rem;
        margin: 0;
    }
    
    /* Where to Buy */
    .where-to-buy {
        padding: 3rem 0;
    }
    
    .where-content {
        padding: 2rem 1.5rem 2.3rem;
        width: 100%;
        gap: 1.5rem;
        flex-direction: column;
    }
    
    .where-content h2 {
        font-size: 1.5rem;
        line-height: 1.1;
        margin: 0;
        text-align: center;
    }
    
    .stores {
        gap: 1rem;
        flex-direction: column;
        justify-content: center;
    }
    
    .stores img {
        height: 3.8rem;
    }
    
    .stores__link:first-child img {
        height: 6rem;
    }
    
    /* Video */
    .video-section {
        padding: 7.2rem 0rem 1rem;
    }
    
    .video-section::before {
        background-image: url('../images/chocolate-piece-m.png');
        background-repeat: no-repeat;
        background-position: center right;
        background-size: 100%;
    }

    .video-wrapper {
        padding: 0.5rem;
        border-radius: 0.25rem;
    }

    #promo-video {
        height: 10.8rem;
        border-radius: 0.25rem;

    }
    
    .play-button {
        width: 3rem;
    }
    
    /* Footer */
    .footer {
        margin-top: 7rem;
    }
    .footer-content {
        display: flex;
        gap: 1.6rem;
        flex-direction: column;
    }

    .footer-center {
        order: -1;
        margin: auto;
    }

    .footer::before {
        height: 20.625rem;
        background-size: 145%;
        background-position: bottom left;
    }

    .footer-left {
        text-align: left;
        padding: 0;
    }

    .footer-left .company-info h3 {
        margin-bottom: 0.5375rem;
        font-size: 1.13rem;
    }
    
    .footer-left .company-info p {
        font-size: 0.875rem;
        line-height: 1.2;
    }
    
    .footer-left .contact-info .email-label {
        font-size: 1.1rem;
    }
    .footer-left .contact-info .email-link,
    .footer-left .contact-info .contact-link {
        font-size: 1.3rem;
    }
    .footer-left .contact-info .email-link {
        margin-bottom: 1.1rem;
    }
    .footer-left .contact-info {
        margin-top: 1rem;
    }
    
    .konti-logo {
        margin-top: 2.4rem;
        margin-bottom: 0;
    }

    .konti-logo img {
        max-width: 6rem;
    }
    
    .rights-text {
        font-size: 1.13rem;
        line-height: 1;
    }
    
    .footer-right {
        padding-top: 0.3rem;
        text-align: left;
        padding-left: 0;
    }
    .social-links {
        justify-content: center;
    }
    .social-links p {
        font-size: 1.3rem;
    }
    
    .vk-link img {
        width: 2.5rem;
        height: 2.5rem;
    }
    
    .legal-text p {
        margin-bottom: 2rem;
        font-size: 0.85rem;
        line-height: 1.25;
        text-align: justify;
    }
    
    .rules-link {
        font-size: 1.3rem;
        line-height: 1;
        text-align: left;
    }

    .legal-links {
        text-align: left;
        align-items: flex-start;
    }
    
    .legal-links a {
        font-size: 0.865rem;
        text-align: left;
        line-height: 1.5;
    }
    
    .container {
        padding: 0 1rem;
        max-width: 100%;
    }
    
    /* General spacing improvements */
    .gift-icon {
        display: none;
    }
    
    
}

/* General Form Styles - Shared across pages */


.ui-front {
    z-index: 10000 !important;
}

.ui-widget.ui-widget-content {
    transform: translateY(0.5rem);
    border-radius: 1rem;
    border: 1px solid #9B8F8F !important;
    overflow: hidden;
}

.form {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    width: 100%;
}

.forgot-password {
    margin: auto;
    font-size: 1rem;
    color: #E42261;
}

.form-group {
    display: flex;
    flex-direction: column;
    width: 100%;
    position: relative;
}

.form-group label {
    font-size: 1.125rem;
    color: #BB9C9C;
    margin-left: 1.5rem;;
    margin-bottom: 0.05rem;
    font-style: italic;
    font-weight: bold;
    transition: 0.3s;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    max-width: 100%;
    padding: 1rem 1.5rem;
    border: 1px solid #9B8F8F;
    border-radius: 10rem;
    font-size: 1rem;
    background: #FFFFFF;
    transition: border-color 0.3s ease;
    font-family: "PT Sans", 'Arial', sans-serif;

}

.ui-menu .ui-menu-item-wrapper {
    padding: 0.5rem 1.5rem !important;
    font-size: 1rem;
}

.ui-menu .ui-menu-item:only-child .ui-menu-item-wrapper {
    padding: 1rem 1.5rem !important;
}

.form-group select {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #FFF url('../images/arrow-down.svg') no-repeat center right 1.5rem;
    background-size: 1rem;
}

.form-group .big-field {
    padding: 1.9rem 1.5rem;
}
.form-group input::placeholder,
.form-group select::placeholder,
.form-group textarea::placeholder {
    color: #BB9C9C;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: #E42261;
}

.form-group label:has(+ input:focus),
.form-group label:has(+ select:focus),
.form-group label:has(+ textarea) {
    color: #000000;
}

/* Error styles */
.form-group.has-error input,
.form-group.has-error select,
.form-group.has-error textarea {
    border-color: #DC3545;
}

.form-group.has-error label {
    color: #DC3545;
}

.form-error {
    position: absolute;
    right: 0;
    bottom: 90%;
    padding: 0.25rem 0.5rem;
    background: #FFF;
    box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1);
    display: none;
    color: #DC3545;
    font-size: 0.875rem;
    font-style: italic;
    margin-top: 0.25rem;
    margin-left: 1.5rem;
    line-height: 1.2;
}

.form-group.has-error .form-error {
    display: block;
}

/* Upload error styles */
.upload-error {
    display: none;
    color: #DC3545;
    font-size: 0.875rem;
    font-style: italic;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    background: rgba(220, 53, 69, 0.1);
    border-radius: 0.5rem;
    line-height: 1.4;
}

.upload-error.show {
    display: block;
}



.form-group textarea {
    border-radius: 1rem;
    resize: vertical;
    min-height: 9.375rem;
    background: white;
}


.form-submit-btn {
    margin-top: 1rem;
    align-self: center;
    min-width: 200px;
}

.form-note {
    margin-top: 1rem;
    color: #AE8E91;
    font-size: 1.125rem;
    font-weight: bold;
    font-style: italic;
    text-align: center;
    line-height: 1.1;
}

.form-option {
    display: flex;
    width: 100%;
    padding: 1rem 0 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.form-option p {
    margin-bottom: 1rem;
    font-style: italic;
    font-weight: bold;
    font-size: 1.125rem;
    line-height: 1.1;
}

.form-option button {
    text-transform: uppercase;
    font-weight: bold;
    color: #E42261;
    background: none;
    font-size: 1.5rem;
    border: none;
    border-bottom: 1px solid currentColor;
    transition: 0.3s;
    cursor: pointer;
}
.form-option button:hover {
    border-color: transparent;
}

.checkbox-group {
    display: flex;
    width: 75%;
    padding: 1rem;
    flex-direction: column;
    gap: 0.8rem;
}

.checkbox-label {
    display: flex;
    color: #272727;
    font-style: italic;
    font-size: 0.813rem;
    line-height: 1.1;
    cursor: pointer;

}
.checkbox-label a {
    color: #272727;
    text-decoration: underline;
}
.checkbox-label input{
    display: none;
}

.checkmark {
    display: block;
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    border: 1px solid #9B8F8F;
    background-color: white;
    border-radius: 25rem;
    margin-right: 0.8rem;
}
.checkbox-label input:checked + .checkmark {
    background: url('../images/success.svg') no-repeat center;
    background-size: cover;   
    border-color: #E42261; 
}

@media (max-width: 900px) {
    .form-group .big-field {
        padding: 1rem 1.5rem;
    }
}
@media (max-width: 480px) {

    .form {
        gap: 0.8rem;
    }

    .form-group label {
        margin-left: 1.3rem;
        font-size: 0.938rem;
    }

    .form-group input,
    .form-group select {
        height: 3rem;
        padding: 0.3rem 1.5rem;
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
        font-size: 1.125rem;
    }
    .form-group .big-field {
        padding: 1.9rem 1.5rem;
    }

    .forgot-password {
        font-size: 0.8rem;
    }

    .checkbox-group {
        width: 100%;
        padding-left: 0;
    }

}

/* Prizes Page Styles */
.prizes-main .prize-content {
    text-align: left;
}
.prizes-main .prize-content p{
    margin-bottom: 1rem;
}

.prizes-main .prize-card {
    display: flex;
    flex-direction: column;
    padding-bottom: 2.25rem;
}

.dates-btn {
    display: block;
    background: none;
    border: none;
    color: #E42261;
    font-size: 1.5rem;
    font-weight: bold;
    font-style: italic;
    text-decoration: underline;
    cursor: pointer;
    margin: auto auto 0 0;
    transition: color 0.3s ease;
}

.dates-btn:hover {
    color: #FF276D;
}

/* Modal/Popup Styles */
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    padding: 10vh 0;
    justify-content: center;
    align-items: flex-start;
    overflow: auto;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(5px);
}



.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.modal-content {
    position: relative;
    padding: 3.5rem 9.375rem;
    background:#FBEBEC;
    border-radius: 15px;
    width: 50rem;
    max-width: calc(100% - 2rem);
    position: relative;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: modalSlideIn 0.3s ease;
    z-index: 1;
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-50px) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    flex-direction: column;
}

.modal-title {
    margin: 0 auto 0.5rem;
    font-family: 'Dessert Script', 'Arial',sans-serif;
    font-style: italic;
    font-weight: normal;
    color: #000;
    line-height: 1;
    font-size: 3rem;
    text-align: center;
}

.modal-title:not(:has( + .modal-subtitle )) {
    margin-bottom: 2rem;
}

.modal-subtitle {
    margin-bottom: 2rem;
    font-weight: bold;
    font-style: italic;
    font-size: 1.125rem;
    line-height: 1.1;
}


.modal-close {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    background: none;
    border: none;
    font-size: 3rem;
    cursor: pointer;
    font-weight: lighter;
    background: url('../images/close.svg') no-repeat center;
    background-size: 1.1rem;
    padding: 0;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.modal-close:hover {
    transform: rotate(90deg);
}

.modal-body {
}

.modal-icon {
    display: block;
    width: 3.125rem;
    height: 3.125rem;
    margin: 0 auto 2rem;
}

.modal-message {
    margin-bottom: 1rem;
    font-weight: bold;
    font-style: italic;
    font-size: 1.125rem;
    text-align: center;
    color: #000;
}

.modal-message p:not(:last-child) {
    margin-bottom: 1rem;
}

.modal-message small{
    display: block;
    margin-top: 1rem;
    font-size: 0.75rem;
    color: #AE8E91;
    line-height: 1.1;
}

.modal-list li {
    display: flex;
    margin-bottom: 1rem;
    line-height: 1.1;
    list-style: none;
    counter-increment: my-counter;
    font-style: italic;
    font-weight: bold;
}


.modal-list li::before {
    content: counter(my-counter);
    width: 1.125rem;
    height: 1.125rem;
    line-height: 1.125rem;
    flex-shrink: 0;
    font-size: 0.625rem;
    border-radius: 1rem;
    margin-right: 0.625rem;
    text-align: center;
    color: #FFF;
    background-color: #E42261;
    display: block;
}

.modal-footer {
    display: flex;
    justify-content: center;
    padding: 15px 25px 25px;
    text-align: right;
}

.white-modal .modal-content {
    padding: 3.5rem 3.75rem;
    background: #fff;
}

.white-modal .modal-title {
    color: #E42261;
}

@media (max-width: 480px) {
    .modal {
        padding: 2rem 0;
    }
    .modal-content {
        min-width: 100%;
        margin: 20px;
        padding: 3.5rem 1.25rem;
    }
    
    .modal-title {
        margin-bottom: 1rem;
        font-size: 3rem;
        line-height: 0.9;
    }

    .modal-title:not(:has( + .modal-subtitle )) {
        margin-bottom: 2rem;
    }

    .modal-subtitle {
        font-size: 1.125rem;
        line-height: 1.1;
    }
    .modal-list li {
        margin-bottom: 0.8rem;
    }
    .prizes-main .prize-card {
        height: auto;
    }
    .prizes-main .prize-content p {
        font-size: 1rem;
    }
    .dates-btn {
        font-size: 1rem;
    }
    .white-modal .modal-content {
        padding: 3.5rem 1.25rem;

    }
    .white-modal .modal-title {
        font-size: 2rem;
    }
}

/* Photo Upload Modal Styles */
.photo-upload-modal-content {
    max-width: 50rem;
}

.upload-instructions {
    margin-bottom: 1.5rem;
    color: #2E2925;
    font-size: 1.125rem;
    line-height: 1.2;
    
}

.upload-instructions p {
    position: relative;
    padding-left: 1rem;
    margin-bottom: 0.5rem;
    font-style: italic;
    font-weight: bold;

}

.upload-instructions i {
    position: absolute;
    left: 0;
    top: 0;
}

.upload-instructions strong {
    font-weight: bold;
}

.requirements-title {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    color: #E42261;
    margin-bottom: 1.5rem;
    letter-spacing: 1px;
    text-decoration: underline;
    cursor: pointer;
}

.upload-area {
    border: 1px solid #9B8F8F;
    background: #FFF;
    border-radius: 1rem;
    padding: 3rem 2rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    margin: 0 auto 2rem;
    position: relative;
    width: 19.688rem;
    min-height: 18.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upload-area:hover {
    border-color: #E42261;
    background-color: rgba(255, 255, 255, 0.5);
}

.upload-area.dragover {
    border-color: #E42261;
    background-color: rgba(228, 34, 97, 0.1);
    transform: scale(1.02);
}

.upload-content {
    pointer-events: none;
}

.upload-text {
    color: #BB9C9C;
    font-size: 1.125rem;
    font-style: italic;
    line-height: 1.4;
}

.preview-container {
    position: relative;
    width: 100%;
    max-width: 20rem;
    margin: 0 auto;
}

.preview-container img {
    width: 100%;
    height: auto;
    max-height: 15rem;
    object-fit: contain;
    border-radius: 0.5rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.remove-photo-btn {
    position: absolute;
    top: -0.5rem;
    right: -0.5rem;
    background: #E42261;
    color: white;
    border: none;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(228, 34, 97, 0.3);
}

.remove-photo-btn:hover {
    background: #FF276D;
    transform: scale(1.1);
}

.upload-submit-btn {
    margin: 0 auto;
    width: 100%;
}



@media (max-width: 480px) {
    .photo-upload-modal-content {
        padding: 2rem 1.25rem;
    }
    
    .upload-instructions {
        font-size: 0.9rem;
    }
    
    .requirements-title {
        font-size: 1rem;
    }
    
    .upload-area {
        padding: 2rem 1rem;
    }
    
    .upload-text {
        font-size: 1rem;
    }
    
    .preview-container img {
        max-height: 12rem;
    }
}

.requirements-modal-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 3.5rem 3.125rem;
    gap: 2rem
}

@media (max-width: 480px) {
    .requirements-modal-content {
        display: flex;
        flex-direction: column;
        padding: 3.5rem 2.188rem;

    }
}

table {
    border-collapse: collapse;
    width: 100%;
    margin: 2rem auto;
    font-style: italic;
    border: none;
}

th, td {
    padding: 1.063rem 1.125rem 1.063rem 3.125rem;
    text-align: left;
    line-height: 1;
}

th {
    font-family: 'Dessert Script', 'Arial',sans-serif;    
    font-style: italic;
    font-size: 1.5rem;                 
    letter-spacing: 0.06em;                   
}

td  {
    border-bottom: 2px solid #DAE5EE;
    font-size: 1.5rem;                 

}

tbody tr:hover {
    background-color: #f0f0f0;
}

.not-found-where-to-buy {
    margin-top: 12rem;
}
@media (max-width: 480px) {
    table {
        margin: 0rem auto;
    }
    th, td {
        padding: 0.7rem;
        font-size: 1rem;
    }
    .not-found-where-to-buy {
        margin-top: 3rem;
    }
}

/* Winners Page Styles */
.winners-content {
    max-width: 100%;
}

.winners-search {
    margin-bottom: 3rem;
    text-align: center;
}

.search-title {
    font-family: 'Dessert Script', 'Arial',sans-serif;
    font-style: italic;

    font-size: 3rem;
    color: #E42261;
    margin-bottom: 2rem;
    line-height: 1;
}

.search-form {
    display: flex;
    justify-content: center;
}

.search-row {
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
    flex-wrap: wrap;
    justify-content: center;
}

.search-input {
    width: 100%;
    max-width: 15rem;
    padding: 1rem 1.5rem;
    border: 1px solid #9B8F8F;
    border-radius: 10rem;
    font-size: 1rem;
    background: #FFFFFF;
    transition: border-color 0.3s ease;
    font-family: "PT Sans", 'Arial', sans-serif;
}

.search-input:focus {
    outline: none;
    border-color: #E42261;
}

.search-input::placeholder {
    color: #BB9C9C;
}

.search-btn {
    min-width: 8rem;
    white-space: nowrap;
}

.winners-categories {
    display: flex;
    flex-direction: column;
    gap: 8rem;
}

.winner-block {

}

.winner-header {
    padding: 2rem 2.5rem 1.5rem;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.4rem;
}




.winner-header h3 {
    font-family: 'Dessert Script', 'Arial',sans-serif;
    font-style: italic;
    font-size: 3rem;
    color: #E42261;
    margin: 0;
    font-weight: normal;
    line-height: 1;
    position: relative;
    z-index: 1;
}

.winner-description {
    font-size: 2rem;
    color: #5E5E5E;
    margin: 0;
    font-style: italic;
    font-weight: bold;
    line-height: 1.2;
    position: relative;
    z-index: 1;
    text-align: center;
}

.winner-header .dates-btn {
    background: none;
    border: none;
    color: #E42261;
    font-size: 1.125rem;
    font-weight: bold;
    font-style: italic;
    text-decoration: underline;
    cursor: pointer;
    margin: 0;
    transition: color 0.3s ease;
    position: relative;
    z-index: 1;
}

.winner-header .dates-btn:hover {
    color: #FF276D;
}

.winners-table-container {
    max-height: 580px;
    overflow-y: auto;
    position: relative;
}

/* Custom Scrollbar */
.winners-table-container::-webkit-scrollbar {
    width: 12px;
}

.winners-table-container::-webkit-scrollbar-track {
    background: #DAE5EE;
    border-radius: 6px;
    border: 2px solid white;
}

.winners-table-container::-webkit-scrollbar-thumb {
    background: #E42261;
    border-radius: 6px;
    border: 2px solid white;
}

.winners-table-container::-webkit-scrollbar-thumb:hover {
    background: #FF276D;
}

/* Firefox scrollbar */
.winners-table-container {
    scrollbar-width: thin;
    scrollbar-color: #E42261 #DAE5EE;
}

.winner-block table {
    margin: 0 auto;
    width: 80%;
}

.winner-block th {
    position: sticky;
    top: 0;
    font-size: 2rem;
    z-index: 10;
    color: #2E2925;
    background: #FFF;
}

.winner-block td {
    background: white;
}

.winner-block tbody tr:hover {
    background-color: rgba(228, 34, 97, 0.02);
}

/* Search filters matching mockup */
.category-filter {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin: 2.5rem 0 6rem;
    padding: 0 2.5rem;
}

.filter-date {
    display: flex;

    width: 25rem;
    height: 4.875rem;
    background: #E42261;
    color: white;
    border: none;
    padding: 0.75rem 2rem;
    border-radius: 10rem;
    font-style: italic;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.5rem;
}

.filter-date img {
    width: 2.125rem;
}

.filter-date i {
    margin-left: auto;
}

.filter-phone {
    background: rgba(228, 34, 97, 0.1);
    border: 1px solid #E42261;
    padding: 0.75rem 2rem;
    border-radius: 2rem;
    font-style: italic;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.5rem;
    color: #E42261;
}

/* Phone Filter Input Styles */
.filter-phone-container {
    position: relative;
    width: 25rem;
    height: 4.875rem;
    max-width: 100%;
}

.filter-phone-input {
    height: 100%;
    width: 100%;
    padding: 0.75rem 1.5rem;
    border: 2px solid #E42261;
    border-radius: 4rem;
    font-size: 1.5rem;
    font-style: italic;
    font-weight: bold;
    background: white;
    color: #E42261;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.filter-phone-input:focus {
    outline: none;
    border-color: #FF276D;
    box-shadow: 0 0 0 2px rgba(228, 34, 97, 0.1);
}

.filter-phone-input::placeholder {
    color: #E42261;
}

.filter-phone-btn {
    position: absolute;
    top: 50%;
    right: 1.625rem;
    transform: translateY(-50%);
    width: 2.5rem;
    background: none;
    border: none;
    cursor: pointer;
}


/* Dropdown Styles */
.filter-date-dropdown {
    position: relative;
    display: inline-block;
}


.filter-date-dropdown .filter-date:hover {
    background: #FF276D;
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border: 1px solid #E42261;
    border-radius: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    min-width: 100%;
    max-height: 200px;
    overflow-y: auto;
    margin-top: 0.5rem;
}

.dropdown-menu::-webkit-scrollbar {
    width: 6px;
}

.dropdown-menu::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.dropdown-menu::-webkit-scrollbar-thumb {
    background: #E42261;
    border-radius: 3px;
}

.dropdown-item {
    padding: 0.75rem 1rem;
    cursor: pointer;
    font-size: 0.875rem;
    font-style: italic;
    color: #2E2925;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.3s ease;
}

.dropdown-item:last-child {
    border-bottom: none;
}

.dropdown-item:hover {
    background-color: rgba(228, 34, 97, 0.1);
    color: #E42261;
}

.dropdown-item.selected {
    background-color: rgba(228, 34, 97, 0.2);
    color: #E42261;
    font-weight: bold;
}

.filter-date-dropdown.open .dropdown-menu {
    display: block;
}

@media (max-width: 890px) {
    .category-filter {
        padding: 0;
    }
    .filter-phone-input {
        
    }
}

@media (max-width: 480px) {
    .search-row {
        flex-direction: column;
        gap: 1rem;
    }
    
    .search-input {
        max-width: 100%;
    }
    
    .winner-header {
        padding: 1.5rem 0rem;
    }
    
    .winner-header h3 {
        font-size: 2.25rem;
        line-height: 1;
    }
    
    .winner-description {
        font-size: 1.125rem;
    }
    
    .winners-table-container {
        max-height: 400px;
    }
    
    .category-filter {
        padding: 0;
        flex-wrap: wrap;
        margin: 2rem 0;
        gap: 0.5rem;
    }
    
    .filter-date-dropdown {
        width: 100%;
        margin-bottom: 0rem;
    }
    
    .filter-date {
        width: 100%;
        height: 3.75rem;
        justify-content: center;
        gap: 0.3rem;
        padding: 1rem 1.625rem;
        font-size: 1rem;
        font-weight: normal;
    }
    
    .filter-date img {
        width: 1.625rem;
    }

    .filter-phone {
        width: 100%;
        
        justify-content: center;
        padding: 1rem 2rem;
    }
    
    .filter-phone-container {
        width: 100%;
        height: 3.75rem;

        flex-direction: column;
        gap: 0.5rem;
    }
    
    .filter-phone-input {
        width: 100%;
        padding: 1rem 1.625rem;
        min-width: auto;
        font-size: 1rem;
    }
    
    .filter-phone-btn {
        width: 2.438rem;
        right: 0.688rem;
        justify-content: center;
    }
    
    .dropdown-menu {
        width: 100%;
        left: 0;
        right: 0;
    }
    .winners-categories {
        gap: 2rem
    }

    
    /* Mobile Table Styles - Card Layout */
    .winner-block table {
        display: none;
    }
    
    .winner-block .mobile-winners-list {
        display: block;
        padding: 0 1rem 0 0;
    }
    
    .mobile-winner-card {
        background: white;
        padding: 0 0 1rem;
        margin-bottom: 1rem;
        border-bottom: 2px solid #DAE5EE;
    }
    
    .mobile-winner-card:last-child {
        margin-bottom: 0;
        border: none;
    }
    
    .mobile-winner-field {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 0.5rem 0;
        font-size: 1.25rem;
        line-height: 1;
    }
    
    .mobile-winner-field:last-child {
        border-bottom: none;
    }
    
    .mobile-field-label {
        font-weight: bold;
        font-family: 'Dessert Script', 'Arial',sans-serif;
        font-style: italic;
        font-weight: 400;                                       
        min-width: 35%;
        margin-right: 1rem;
    }
    
    .mobile-field-value {
        color: #2E2925;
        flex: 1;
        font-style: italic;
    }
    
    .mobile-field-value b {
        font-family: 'Dessert Script', 'Arial',sans-serif;
        font-style: italic;
        font-weight: 400;                                       
        font-size: 1rem;                                        
    }

    .mobile-empty-state {
        text-align: center;
        padding: 2rem 1rem;
        color: #999;
        font-style: italic;
    }
}

/* Desktop: Hide mobile layout */
@media (min-width: 481px) {
    .mobile-winners-list {
        display: none;
    }
}

.cookies {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 3.704vh 0;
    background: #FFF;
    box-shadow: -1px 0 7px rgba(0, 0, 0, 0.7);
    z-index: 100;
}

.cookies__inner {
    display: flex;
    align-items: center;
}

.cookies__text {
    color: #9B8F8F;
    font-weight: bold;
    font-style: italic;
    font-size: 2.593vh;
    line-height: 1.2;
}

.cookies__btn {
    width: 12.688rem;
    flex-shrink: 0;
}

@media (max-width: 480px) {
    .cookies {
        padding: 1.5rem 0;
    }
    .cookies__inner {
        flex-direction: column;
    }
    .cookies__text {
        font-size: 0.75rem;
        text-align: center;
        margin-bottom: 1rem;
    }
    .cookies__btn {
        width: 100%;
    }
}