@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Manrope:wght@400;600;800&display=swap");

      :root {
        --bg-1: #0a1026;
        --bg-2: #3d1d55;
        --bg-3: #ff4f8b;
        --text: #f7f7fb;
        --muted: #ced2eb;
        --card: rgba(255, 255, 255, 0.1);
        --line: rgba(255, 255, 255, 0.22);
        --accent: #ffd166;
      }

      * {
        box-sizing: border-box;
      }

      html,
      body {
        margin: 0;
        min-height: 100%;
      }

      body {
        color: var(--text);
        font-family: "Manrope", sans-serif;
        background: radial-gradient(circle at 20% 10%, #5e2f86 0%, transparent 35%),
          radial-gradient(circle at 90% 25%, #ef476f 0%, transparent 25%),
          radial-gradient(circle at 15% 85%, #2d6cdf 0%, transparent 30%),
          linear-gradient(135deg, var(--bg-1), var(--bg-2) 45%, var(--bg-3));
        background-attachment: fixed;
        overflow-x: hidden;
      }

      .noise {
        pointer-events: none;
        position: fixed;
        inset: 0;
        opacity: 0.18;
        z-index: 1;
        mix-blend-mode: soft-light;
        background-image: radial-gradient(#ffffff 0.6px, transparent 0.6px);
        background-size: 3px 3px;
      }

      .orb {
        position: fixed;
        border-radius: 999px;
        filter: blur(8px);
        opacity: 0.45;
        z-index: 0;
        animation: drift 12s ease-in-out infinite;
      }

      .orb.one {
        width: 220px;
        height: 220px;
        top: 12%;
        left: -40px;
        background: #ffd166;
      }

      .orb.two {
        width: 280px;
        height: 280px;
        bottom: 8%;
        right: -60px;
        background: #5eead4;
        animation-delay: -4s;
      }

      @keyframes drift {
        0%,
        100% {
          transform: translateY(0) scale(1);
        }
        50% {
          transform: translateY(-20px) scale(1.08);
        }
      }

      main {
        position: relative;
        z-index: 2;
      }

      .section {
        width: min(1120px, 92vw);
        margin: 0 auto;
      }

      .winactie-banner {
        padding: 0;
        margin-top: 3rem;
        margin-bottom: 3rem;
      }
      .winactie-banner-inner {
        display: flex;
        align-items: center;
        gap: 1rem;
        flex-wrap: wrap;
        text-decoration: none;
        color: #f7f7fb;
        border: 1px solid rgba(255, 209, 102, 0.55);
        border-radius: 18px;
        background: linear-gradient(110deg, rgba(255, 209, 102, 0.13) 0%, rgba(255, 79, 139, 0.15) 100%);
        padding: 1rem 1.2rem;
        transition: border-color 0.2s ease, background 0.2s ease;
      }
      .winactie-banner-inner:hover {
        border-color: rgba(255, 209, 102, 0.9);
        background: linear-gradient(110deg, rgba(255, 209, 102, 0.2) 0%, rgba(255, 79, 139, 0.22) 100%);
      }
      .winactie-banner-left {
        display: flex;
        flex-direction: column;
        gap: 0.2rem;
        flex: 1 1 200px;
      }
      .winactie-banner-left strong {
        font-size: 1.12rem;
        font-weight: 900;
      }
      .winactie-banner-left span {
        color: #ced2eb;
        font-size: 0.88rem;
      }
      .winactie-live-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        background: rgba(156, 230, 178, 0.15);
        border: 1px solid rgba(156, 230, 178, 0.45);
        border-radius: 999px;
        padding: 0.18rem 0.6rem;
        font-size: 0.72rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: #9ce6b2;
        width: fit-content;
      }
      .winactie-live-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #9ce6b2;
        animation: winactie-pulse 1.4s ease-in-out infinite;
      }
      @keyframes winactie-pulse {
        0%, 100% { opacity: 1; transform: scale(1); }
        50% { opacity: 0.3; transform: scale(0.6); }
      }
      .winactie-banner-prizes {
        display: flex;
        gap: 0.5rem;
      }
      .winactie-prize {
        background: linear-gradient(135deg, #ffd166, #ff9f43);
        color: #0f1020;
        border-radius: 10px;
        padding: 0.45rem 0.85rem;
        font-weight: 900;
        font-size: 1.1rem;
      }
      .winactie-arrow {
        font-size: 1.4rem;
        color: #ffd166;
        flex-shrink: 0;
      }

      .submit-festival-controls {
        position: fixed;
        top: 14px;
        right: 14px;
        z-index: 60;
        display: flex;
        align-items: center;
        gap: 0.55rem;
      }

      .submit-festival-fixed {
        text-decoration: none;
        color: #0f1020;
        background: var(--accent);
        border-radius: 999px;
        padding: 0.7rem 1rem;
        font-weight: 800;
        box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
      }
      .language-dropdown-wrap {
        position: relative;
      }
      .language-dropdown.is-customized {
        display: none;
      }
      .custom-select {
        position: relative;
        z-index: 1;
      }
      .custom-select.is-open {
        z-index: 80;
      }
      .custom-select-trigger {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        border: 0;
        background: transparent;
        color: var(--text);
        cursor: pointer;
        font-family: inherit;
      }
      .custom-select-label {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .custom-select-chevron {
        opacity: 0.85;
        line-height: 1;
      }
      .custom-select-menu {
        position: absolute;
        left: 0;
        right: 0;
        top: calc(100% + 0.35rem);
        z-index: 90;
        display: none;
        padding: 0.35rem;
        border: 1px solid var(--line);
        border-radius: 10px;
        background: #171a2e;
        box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25);
      }
      .custom-select.is-open .custom-select-menu {
        display: block;
      }
      .custom-select-option {
        width: 100%;
        border: 0;
        background: transparent;
        color: var(--text);
        padding: 0.55rem 0.75rem;
        text-align: left;
        border-radius: 7px;
        cursor: pointer;
        font-family: inherit;
        font-size: 0.95rem;
      }
      .custom-select-option:hover,
      .custom-select-option.is-selected {
        background: rgba(255, 255, 255, 0.14);
      }
      .custom-select--lang .custom-select-trigger {
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.35);
        background: rgba(10, 11, 26, 0.82);
        padding: 0.7rem 1rem;
        font-size: 1rem;
        font-weight: 800;
        box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
        gap: 0.4rem;
      }
      .custom-select--lang .custom-select-menu {
        left: auto;
        right: 0;
        min-width: 80px;
      }

      .hero {
        min-height: 82vh;
        display: grid;
        align-content: center;
        padding: 4rem 0 0.8rem;
      }

      h1 {
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(3.8rem, 16vw, 9.4rem);
        line-height: 0.9;
        margin: 0;
        letter-spacing: 0.02em;
        text-wrap: balance;
      }

      .hero p {
        max-width: 62ch;
        font-size: clamp(1rem, 1.8vw, 1.22rem);
        color: var(--muted);
        margin: 1.3rem 0 2rem;
      }

      .cta {
        display: flex;
        flex-wrap: wrap;
        gap: 0.85rem;
      }
      .hero-search {
        margin-top: 1rem;
        position: relative;
        display: block;
        max-width: 720px;
      }
      .hero-search-input {
        width: 100%;
        border: 1px solid var(--line);
        border-radius: 999px;
        background: rgba(10, 11, 26, 0.45);
        color: var(--text);
        padding: 0.82rem 1rem;
        font-size: 0.98rem;
      }
      .hero-search-input::placeholder {
        color: rgba(206, 210, 235, 0.9);
      }
      .hero-search-input:focus {
        outline: 2px solid rgba(255, 209, 102, 0.55);
        outline-offset: 2px;
      }
      .hero-search-results {
        position: absolute;
        top: calc(100% + 0.4rem);
        left: 0;
        right: 0;
        border: 1px solid var(--line);
        border-radius: 14px;
        background: rgba(10, 11, 26, 0.96);
        backdrop-filter: blur(10px);
        overflow: hidden;
        z-index: 40;
      }
      .hero-search-result-item {
        display: block;
        text-decoration: none;
        color: var(--text);
        padding: 0.72rem 0.9rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
      }
      .hero-search-result-item:last-child {
        border-bottom: 0;
      }
      .hero-search-result-item:hover {
        background: rgba(255, 209, 102, 0.14);
      }
      .hero-search-result-title {
        display: block;
        font-weight: 700;
      }
      .hero-search-result-meta {
        display: block;
        margin-top: 0.15rem;
        font-size: 0.85rem;
        color: var(--muted);
      }
      .hero-search-empty {
        padding: 0.75rem 0.9rem;
        color: var(--muted);
        font-size: 0.9rem;
      }

      .button {
        text-decoration: none;
        color: #0f1020;
        background: var(--accent);
        padding: 0.85rem 1.4rem;
        border-radius: 999px;
        font-weight: 800;
        transition: transform 0.25s ease, box-shadow 0.25s ease;
      }

      .button.alt {
        background: transparent;
        color: var(--text);
        border: 1px solid rgba(255, 255, 255, 0.35);
      }

      .button:hover {
        transform: translateY(-3px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
      }

      .floating-cards {
        margin-top: 2.5rem;
        display: grid;
        gap: 0.9rem;
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
      }

      .hero-stats {
        margin-top: 1.25rem;
        display: grid;
        gap: 0.8rem;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      }

      .stat-card {
        border: 1px solid var(--line);
        border-radius: 14px;
        background: rgba(10, 11, 26, 0.42);
        backdrop-filter: blur(10px);
        padding: 0.85rem 0.95rem;
      }

      .stat-label {
        margin: 0;
        color: var(--muted);
        font-size: 0.82rem;
      }

      .stat-value {
        margin: 0.25rem 0 0;
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(1.7rem, 5vw, 2.3rem);
        line-height: 0.95;
        letter-spacing: 0.03em;
      }

      .this-week {
        margin-bottom: 3rem;
      }

      .section-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.8rem;
        margin-bottom: 0.75rem;
      }

      .week-strip {
        display: grid;
        gap: 0.75rem;
      }

      .week-item {
        border: 1px solid var(--line);
        border-radius: 14px;
        background: rgba(10, 11, 26, 0.35);
        backdrop-filter: blur(10px);
        padding: 0.9rem 1rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.7rem;
      }

      .week-item h3 {
        margin: 0 0 0.25rem;
        font-size: 1rem;
      }

      .week-item p {
        margin: 0;
        color: var(--muted);
        font-size: 0.9rem;
      }

      .genres {
        margin-bottom: 3.5rem;
      }

      .genre-rail {
        display: flex;
        flex-wrap: wrap;
        gap: 0.6rem;
      }

      .genre-pill {
        text-decoration: none;
        color: #f7f7fb;
        border: 1px solid var(--line);
        border-radius: 999px;
        padding: 0.52rem 0.92rem;
        font-weight: 700;
        background: rgba(255, 255, 255, 0.08);
      }

      .genre-pill:hover {
        background: rgba(255, 209, 102, 0.2);
        border-color: rgba(255, 209, 102, 0.6);
      }

      .block-title {
        margin: 0 0 0.8rem;
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(2rem, 6vw, 3.2rem);
        letter-spacing: 0.03em;
      }

      .spotlight {
        margin: 0 0 2.2rem;
      }

      .spotlight-full {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
      }

      .spotlight-head {
        width: min(1120px, 92vw);
        margin: 0 auto 0.8rem;
      }

      .slider-shell {
        border: 1px solid var(--line);
        border-radius: 0;
        background: rgba(10, 11, 26, 0.42);
        backdrop-filter: blur(10px);
        overflow: hidden;
      }

      .slider-track {
        display: flex;
        gap: 0.8rem;
        width: max-content;
        padding: 0.9rem;
        animation: slide-left 28s linear infinite;
      }

      .slide-card {
        width: min(78vw, 300px);
        border: 1px solid var(--line);
        border-radius: 14px;
        padding: 0.9rem;
        background: rgba(255, 255, 255, 0.08);
      }

      .slide-card h3 {
        margin: 0 0 0.3rem;
        font-size: 1rem;
      }

      .slide-card p {
        margin: 0;
        color: var(--muted);
        font-size: 0.92rem;
      }

      @keyframes slide-left {
        from {
          transform: translateX(0);
        }
        to {
          transform: translateX(-50%);
        }
      }

      .chip {
        border: 1px solid var(--line);
        background: var(--card);
        backdrop-filter: blur(8px);
        border-radius: 14px;
        padding: 0.8rem 1rem;
        font-weight: 600;
        transform: translateY(20px);
        opacity: 0;
      }

      .horizontal-wrap {
        margin: 2.2rem 0 4.5rem;
      }

      .h-track {
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        overflow: hidden;
        white-space: nowrap;
        position: relative;
      }

      .h-text {
        display: inline-block;
        font-family: "Bebas Neue", sans-serif;
        letter-spacing: 0.08em;
        font-size: clamp(1.8rem, 5vw, 3.4rem);
        padding: 0.8rem 0;
        will-change: transform;
      }

      .content-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 1rem;
        margin-bottom: 6rem;
      }

      .panel {
        padding: 1.2rem;
        border: 1px solid var(--line);
        border-radius: 16px;
        background: rgba(10, 11, 26, 0.35);
        backdrop-filter: blur(10px);
        transform: translateY(24px);
        opacity: 0;
      }

      .panel h3 {
        margin: 0 0 0.35rem;
        font-size: 1.05rem;
      }

      .panel p {
        margin: 0;
        color: var(--muted);
      }

      .big-quote {
        border: 1px solid var(--line);
        border-radius: 24px;
        background: rgba(255, 255, 255, 0.08);
        padding: 1.8rem;
        margin-bottom: 5rem;
        transform: translateY(20px);
        opacity: 0;
      }

      .big-quote p {
        margin: 0;
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(2rem, 5.8vw, 4.2rem);
        line-height: 0.95;
        letter-spacing: 0.04em;
      }

      .social-proof {
        margin-bottom: 4rem;
      }

      .proof-card {
        border: 1px solid var(--line);
        border-radius: 18px;
        background: linear-gradient(140deg, rgba(10, 11, 26, 0.56), rgba(255, 79, 139, 0.2));
        backdrop-filter: blur(12px);
        padding: 1.2rem;
      }

      .proof-kicker {
        margin: 0;
        color: var(--accent);
        font-weight: 800;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        font-size: 0.78rem;
      }

      .proof-card h2 {
        margin: 0.35rem 0 0.9rem;
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(2rem, 5vw, 3.4rem);
        line-height: 0.95;
      }

      .proof-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
        gap: 0.7rem;
      }

      .proof-grid div {
        border: 1px solid rgba(255, 255, 255, 0.22);
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.08);
        padding: 0.7rem 0.8rem;
        display: grid;
        gap: 0.2rem;
      }

      .proof-grid strong {
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(1.6rem, 4vw, 2.2rem);
        line-height: 1;
      }

      .proof-grid span {
        color: var(--muted);
        font-size: 0.85rem;
      }

      .partner-logo {
        height: 48px;
        width: auto;
        object-fit: contain;
        opacity: 0.6;
        transition: opacity 0.2s;
      }

      .partner-logo:hover {
        opacity: 1;
      }

      .faq {
        margin-bottom: 5rem;
      }

      .faq h2 {
        font-family: "Bebas Neue", sans-serif;
        font-size: clamp(2rem, 5vw, 3.2rem);
        letter-spacing: 0.04em;
        margin: 0 0 1rem;
      }

      .faq-item {
        border: 1px solid var(--line);
        border-radius: 14px;
        background: rgba(10, 11, 26, 0.35);
        backdrop-filter: blur(10px);
        padding: 1rem 1.2rem;
        margin-bottom: 0.8rem;
      }

      .faq-item h3 {
        margin: 0 0 0.35rem;
        font-size: 1rem;
      }

      .faq-item p {
        margin: 0;
        color: var(--muted);
      }

      @media (max-width: 680px) {
        .submit-festival-controls {
          top: 10px;
          right: 10px;
          gap: 0.4rem;
        }
        .submit-festival-fixed {
          font-size: 0.82rem;
          padding: 0.62rem 0.85rem;
        }
        .custom-select--lang .custom-select-trigger {
          padding: 0.62rem 0.85rem;
          font-size: 0.82rem;
        }

        .section-head {
          align-items: flex-start;
          flex-direction: column;
        }

        .week-item {
          flex-direction: column;
          align-items: flex-start;
        }

      }

      footer {
        border-top: 1px solid var(--line);
        padding: 3rem 0 2rem;
        color: var(--muted);
      }

      .footer-inner {
        width: min(1120px, 92vw);
        margin: 0 auto;
        display: grid;
        grid-template-columns: 2fr 1fr 1fr 1fr;
        gap: 2.5rem;
      }

      .footer-col {
        display: flex;
        flex-direction: column;
        gap: 0.6rem;
      }

      .footer-brand {
        font-size: 1.1rem;
        color: var(--text);
        margin-bottom: 0.2rem;
      }

      .footer-tagline {
        margin: 0 0 0.4rem;
        font-size: 0.88rem;
        line-height: 1.5;
      }

      .footer-col-title {
        font-size: 0.8rem;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        color: var(--text);
        margin-bottom: 0.4rem;
      }

      .footer-col a {
        color: var(--muted);
        text-decoration: none;
        font-size: 0.9rem;
      }

      .footer-col a:hover {
        color: var(--text);
      }

      .footer-col--partner a {
        display: inline-block;
      }

      .footer-bottom {
        width: min(1120px, 92vw);
        margin: 2rem auto 0;
        font-size: 0.82rem;
      }

      .social-link {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
      }

      .reveal.in {
        animation: rise-in 0.8s cubic-bezier(0.18, 0.81, 0.29, 0.99) forwards;
      }

      @keyframes rise-in {
        from {
          opacity: 0;
          transform: translateY(20px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      @media (max-width: 740px) {
        .hero {
          min-height: 88vh;
          padding-top: 5rem;
        }

        .slider-track {
          animation-duration: 34s;
        }

        .horizontal-wrap {
          margin: 1.6rem 0 3.2rem;
        }

        .footer-inner {
          grid-template-columns: 1fr 1fr;
          gap: 2rem 1.5rem;
        }

        .footer-inner > .footer-col:first-child,
        .footer-col--partner {
          grid-column: 1 / -1;
        }
      }