.creator-page {
    --creator-ink: #111a32;
    --creator-night: #071020;
    --creator-blue: #34bad9;
    --creator-pink: #e95aa9;
    --creator-gold: #d5ad55;
    --creator-gold-light: #f4df9a;
    --creator-cream: #fbf8f1;
    overflow: hidden;
    color: var(--creator-ink);
    background: #fff;
}
.creator-shell {
    width: min(1180px, calc(100% - 40px));
    margin-inline: auto;
}
.creator-hero {
    position: relative;
    display: grid;
    min-height: 620px;
    isolation: isolate;
    color: #fff;
    background: var(--creator-night) url('../img/public/ustvarjalec-plesa-ozadje.webp') right center / auto 100% no-repeat;
}
.creator-hero::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: '';
    background:
        linear-gradient(90deg, rgba(4, 10, 23, .98) 0%, rgba(4, 10, 23, .92) 36%, rgba(4, 10, 23, .72) 49%, rgba(4, 10, 23, .16) 62%, rgba(4, 10, 23, 0) 70%),
        linear-gradient(0deg, rgba(4, 10, 23, .28), transparent 35%);
}
.creator-hero__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    align-items: center;
    gap: clamp(48px, 8vw, 120px);
    padding-block: 92px 128px;
}
.creator-hero__content {
    max-width: 735px;
}
.creator-eyebrow,
.creator-kicker {
    margin: 0 0 18px;
    color: var(--creator-gold-light);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
}
.creator-hero h1 {
    max-width: 760px;
    margin: 0;
    font: 700 clamp(58px, 7.2vw, 96px)/.86 Georgia, 'Times New Roman', serif;
    letter-spacing: -.055em;
    text-wrap: balance;
}
.creator-hero h1 em {
    display: block;
    color: var(--creator-gold-light);
    font-weight: 400;
}
.creator-hero__lead {
    max-width: 680px;
    margin: 28px 0 0;
    color: rgba(255, 255, 255, .83);
    font-size: clamp(17px, 1.65vw, 21px);
    line-height: 1.65;
}
.creator-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 34px;
}
.creator-button {
    display: inline-flex;
    min-height: 51px;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.creator-button:hover {
    transform: translateY(-2px);
}
.creator-button--gold {
    color: #16111b;
    background: linear-gradient(115deg, var(--creator-gold-light), #e7c26a 55%, #eea2c7);
    box-shadow: 0 14px 38px rgba(218, 177, 82, .22);
}
.creator-button--ghost {
    color: #fff;
    border-color: rgba(255, 255, 255, .38);
    background: rgba(255, 255, 255, .07);
    backdrop-filter: blur(10px);
}
.creator-button--ghost:hover {
    border-color: var(--creator-gold-light);
    background: rgba(255, 255, 255, .12);
}

.creator-button:focus-visible,
.creator-year-picker select:focus-visible,
.creator-year-picker button:focus-visible,
.creator-podium a:focus-visible,
.creator-contributions__intro a:focus-visible,
.creator-faq summary:focus-visible {
    outline: 3px solid #56d7f0;
    outline-offset: 4px;
}

.creator-hero__trust {
    display: flex;
    flex-wrap: wrap;
    gap: 11px 23px;
    margin: 34px 0 0;
    padding: 0;
    color: rgba(255, 255, 255, .72);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .055em;
    list-style: none;
    text-transform: uppercase;
}

.creator-hero__trust li::before {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 9px 2px 0;
    border-radius: 50%;
    content: '';
    background: var(--creator-gold-light);
    box-shadow: 0 0 14px rgba(244, 223, 154, .7);
}

.creator-seal {
    position: relative;
    display: grid;
    width: clamp(230px, 24vw, 310px);
    aspect-ratio: 1;
    place-content: center;
    justify-self: center;
    border: 1px solid rgba(244, 223, 154, .56);
    border-radius: 50%;
    text-align: center;
    background: radial-gradient(circle, rgba(7, 16, 32, .87) 0 57%, rgba(7, 16, 32, .34) 58% 100%);
    box-shadow: inset 0 0 0 9px rgba(244, 223, 154, .07), 0 30px 80px rgba(0, 0, 0, .3);
    backdrop-filter: blur(8px);
}

.creator-seal::before,
.creator-seal::after {
    position: absolute;
    top: 50%;
    width: 34%;
    height: 1px;
    content: '';
    background: linear-gradient(90deg, transparent, var(--creator-gold-light));
}

.creator-seal::before { left: -19%; }
.creator-seal::after { right: -19%; transform: rotate(180deg); }
.creator-seal span,
.creator-seal b { color: var(--creator-gold-light); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; }
.creator-seal strong { margin: 5px 0; font: 700 clamp(56px, 6vw, 78px)/.9 Georgia, serif; }
.creator-seal small { margin-top: 14px; color: rgba(255, 255, 255, .7); font-size: 10px; letter-spacing: .17em; text-transform: uppercase; }

.creator-highlights {
    position: relative;
    z-index: 2;
    margin-top: -60px;
}

.creator-highlights__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid rgba(213, 173, 85, .26);
    border-radius: 22px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 24px 70px rgba(9, 19, 38, .16);
}

.creator-highlights article {
    padding: 24px 28px;
    border-right: 1px solid #e8e3d9;
}

.creator-highlights article:last-child { border-right: 0; }
.creator-highlights span { display: block; color: #6f531f; font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.creator-highlights strong { display: block; margin-top: 4px; color: var(--creator-ink); font: 700 35px/1.1 Georgia, serif; }
.creator-highlights p { margin: 3px 0 0; color: #6b7180; font-size: 12px; }

.creator-ranking,
.creator-levels,
.creator-contributions,
.creator-faq {
    padding-block: clamp(80px, 9vw, 126px);
}

.creator-ranking {
    background:
        radial-gradient(circle at 8% 10%, rgba(52, 186, 217, .1), transparent 30%),
        linear-gradient(180deg, #fff 0%, #fbfaf7 100%);
}

.creator-section-heading {
    margin-bottom: 55px;
}

.creator-section-heading--split {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 36px;
}

.creator-section-heading--center {
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}

.creator-section-heading .creator-kicker,
.creator-contributions .creator-kicker,
.creator-faq .creator-kicker,
.creator-cta .creator-kicker {
    color: #755519;
}

.creator-section-heading h2,
.creator-contributions h2,
.creator-faq h2,
.creator-cta h2 {
    margin: 0;
    color: var(--creator-ink);
    font: 700 clamp(38px, 4.8vw, 60px)/1.02 Georgia, 'Times New Roman', serif;
    letter-spacing: -.035em;
    text-wrap: balance;
}

.creator-section-heading > div > p:last-child,
.creator-section-heading--center > p:last-child,
.creator-contributions__intro > p,
.creator-faq header > p:last-child,
.creator-cta__inner > div > p:last-child {
    max-width: 660px;
    margin: 18px 0 0;
    color: #626979;
    line-height: 1.7;
}

.creator-year-picker {
    min-width: 250px;
    padding: 14px;
    border: 1px solid #e3dfd6;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(24, 31, 48, .07);
}

.creator-year-picker label { display: block; margin: 0 0 7px 3px; color: #7b6c50; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.creator-year-picker div { display: grid; grid-template-columns: 1fr auto; gap: 7px; }
.creator-year-picker select,
.creator-year-picker button { min-height: 42px; border-radius: 10px; font: inherit; }
.creator-year-picker select { padding: 0 34px 0 12px; border: 1px solid #dcd8cf; color: var(--creator-ink); background: #fff; }
.creator-year-picker button { padding: 0 16px; border: 0; color: #fff; font-size: 12px; font-weight: 800; cursor: pointer; background: var(--creator-ink); }

.creator-empty {
    padding: 58px 30px;
    border: 1px solid #e6dfd0;
    border-radius: 24px;
    text-align: center;
    background: #fff;
    box-shadow: 0 18px 60px rgba(20, 28, 45, .08);
}

.creator-empty strong { display: block; font: 700 28px Georgia, serif; }
.creator-empty p { margin: 10px 0 0; color: #697080; }

.creator-podium {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: 20px;
    margin: 70px 0 40px;
    padding: 0;
    list-style: none;
}

.creator-podium__card {
    position: relative;
    order: 1;
    min-height: 330px;
    overflow: hidden;
    padding: 75px 28px 28px;
    border: 1px solid #e6dfd1;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 20px 55px rgba(18, 26, 43, .09);
}

.creator-podium__card::after {
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    content: '';
    background: linear-gradient(90deg, #8bd7e8, #b19be6, #ec7eb7);
}

.creator-podium__card--1 {
    order: 2;
    min-height: 365px;
    transform: translateY(-28px);
    border-color: rgba(213, 173, 85, .55);
    background: linear-gradient(145deg, #fff 10%, #fffaf0 100%);
    box-shadow: 0 28px 75px rgba(129, 94, 28, .17);
}

.creator-podium__card--1::after { background: linear-gradient(90deg, #b88930, #f2db8a, #c08d2d); }
.creator-podium__card--2 { order: 1; }
.creator-podium__card--3 { order: 3; }
.creator-podium[data-count='1'] { grid-template-columns: minmax(280px, 430px); justify-content: center; }
.creator-podium[data-count='1'] .creator-podium__card--1 { order: initial; transform: none; }
.creator-podium[data-count='2'] { grid-template-columns: repeat(2, minmax(280px, 400px)); justify-content: center; }
.creator-podium[data-count='2'] .creator-podium__card--1 { order: 1; }
.creator-podium[data-count='2'] .creator-podium__card--2 { order: 2; }

.creator-podium__place {
    position: absolute;
    top: 24px;
    right: 24px;
    display: grid;
    width: 56px;
    height: 56px;
    place-content: center;
    border: 1px solid #ded8cc;
    border-radius: 50%;
    text-align: center;
    background: #f8f6f1;
}

.creator-podium__card--1 .creator-podium__place { border-color: #d9b85f; background: linear-gradient(145deg, #fff6cc, #e4bd55); }
.creator-podium__place b { font: 700 22px/1 Georgia, serif; }
.creator-podium__place small { margin-top: 2px; font-size: 7px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.creator-podium__overline { margin: 0 0 18px; color: #70521f; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.creator-podium h3 { max-width: 250px; margin: 0; color: var(--creator-ink); font: 700 30px/1.12 Georgia, serif; }
.creator-podium__level { min-height: 42px; margin: 11px 0 22px; color: #676d7b; font-size: 13px; line-height: 1.5; }
.creator-podium__points { display: block; font: 700 30px Georgia, serif; }
.creator-podium__points span { color: #5c6370; font: 700 11px sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.creator-podium a { display: inline-block; margin-top: 28px; color: #1e7894; font-size: 13px; font-weight: 800; text-decoration: none; }
.creator-podium a span { display: inline-block; margin-left: 6px; transition: transform .2s ease; }
.creator-podium a:hover span { transform: translateX(4px); }

.creator-table-card {
    overflow: hidden;
    border: 1px solid #e5e0d7;
    border-radius: 23px;
    background: #fff;
    box-shadow: 0 20px 65px rgba(17, 26, 50, .08);
}

.creator-table-card__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; border-bottom: 1px solid #ece7df; background: #faf8f4; }
.creator-table-card__head span { color: #6f4f18; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.creator-table-card__head p { margin: 0; color: #5b6270; font-size: 12px; }
.creator-table-scroll { overflow-x: auto; }
.creator-table { width: 100%; border-collapse: collapse; }
.creator-table caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.creator-table th { padding: 15px 22px; color: #58606d; font-size: 10px; letter-spacing: .1em; text-align: left; text-transform: uppercase; background: #fff; }
.creator-table td { padding: 18px 22px; border-top: 1px solid #efebe4; color: #3a4253; font-size: 13px; }
.creator-table td:last-child,
.creator-table th:last-child { text-align: right; }
.creator-table td a { color: var(--creator-ink); font-weight: 800; text-decoration: none; }
.creator-table td a:hover { color: #1c859f; }
.creator-rank-number { display: grid; width: 34px; height: 34px; place-content: center; border-radius: 50%; color: #fff; font-weight: 900; background: var(--creator-ink); }
.creator-level-label { display: inline-flex; padding: 7px 11px; border-radius: 999px; color: #555d6c; font-size: 11px; font-weight: 750; background: #f1f2f5; }
.creator-level-label--bronze { color: #74441f; background: #f5e0ce; }
.creator-level-label--silver { color: #4c5766; background: #e8ecf1; }
.creator-level-label--gold { color: #79540c; background: #f8e9b8; }

.creator-levels {
    color: #fff;
    background: var(--creator-night);
}

.creator-levels .creator-section-heading h2 { color: #fff; }
.creator-levels .creator-section-heading > p:last-child { color: rgba(255, 255, 255, .66); }
.creator-levels__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; }
.creator-level-card { position: relative; min-height: 330px; overflow: hidden; padding: 34px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 23px; background: linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .025)); }
.creator-level-card::before { position: absolute; right: -55px; bottom: -65px; width: 180px; height: 180px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 50%; content: ''; }
.creator-level-card--bronze { background: linear-gradient(145deg, rgba(167, 93, 46, .42), rgba(255, 255, 255, .025)); }
.creator-level-card--silver { background: linear-gradient(145deg, rgba(166, 181, 205, .26), rgba(255, 255, 255, .025)); }
.creator-level-card--gold { border-color: rgba(240, 211, 126, .38); background: linear-gradient(145deg, rgba(185, 140, 37, .38), rgba(255, 255, 255, .025)); }
.creator-level-card__medal { display: block; width: 55px; height: 55px; margin-bottom: 50px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #f7dfb9, #955a32 70%); box-shadow: 0 10px 28px rgba(0, 0, 0, .2); }
.creator-level-card--silver .creator-level-card__medal { background: radial-gradient(circle at 35% 30%, #fff, #8c9aac 70%); }
.creator-level-card--gold .creator-level-card__medal { background: radial-gradient(circle at 35% 30%, #fff5bd, #d5a738 70%); }
.creator-level-card > p { margin: 0 0 9px; color: var(--creator-gold-light); font-size: 9px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.creator-level-card h3 { margin: 0; font: 700 28px/1.15 Georgia, serif; }
.creator-level-card > strong { display: block; margin-top: 17px; color: var(--creator-gold-light); font-size: 13px; }
.creator-level-card > span:last-child { display: block; margin-top: 13px; color: rgba(255, 255, 255, .66); font-size: 12px; line-height: 1.6; }

.creator-contributions { background: var(--creator-cream); }
.creator-contributions__layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(50px, 8vw, 110px); }
.creator-contributions__intro { position: sticky; top: 30px; align-self: start; }
.creator-contributions__intro a { display: inline-block; margin-top: 28px; color: #157c99; font-size: 13px; font-weight: 850; text-decoration: none; }
.creator-rules { display: grid; gap: 12px; }
.creator-rules article { display: grid; grid-template-columns: 58px 1fr; gap: 19px; align-items: start; padding: 20px; border: 1px solid #e5ddce; border-radius: 17px; background: rgba(255, 255, 255, .75); }
.creator-rules article > span { display: grid; width: 52px; height: 52px; place-content: center; border-radius: 15px; color: #106f89; font: 800 17px Georgia, serif; background: #dff5f8; }
.creator-rules h3 { margin: 2px 0 5px; font: 700 19px Georgia, serif; }
.creator-rules p { margin: 0; color: #6c7280; font-size: 12px; line-height: 1.55; }

.creator-faq { background: #fff; }
.creator-faq__layout { display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: clamp(50px, 8vw, 105px); }
.creator-faq__items details { border-bottom: 1px solid #e6e2db; }
.creator-faq__items details:first-child { border-top: 1px solid #e6e2db; }
.creator-faq summary { position: relative; padding: 23px 55px 23px 0; color: var(--creator-ink); font: 700 18px/1.35 Georgia, serif; cursor: pointer; list-style: none; }
.creator-faq summary::-webkit-details-marker { display: none; }
.creator-faq summary span,
.creator-faq summary span::after { position: absolute; top: 50%; right: 4px; width: 16px; height: 2px; content: ''; background: #a67928; transition: transform .2s ease; }
.creator-faq summary span::after { right: 0; transform: rotate(90deg); }
.creator-faq details[open] summary span::after { transform: rotate(0); }
.creator-faq details p { max-width: 680px; margin: -4px 55px 23px 0; color: #687080; font-size: 13px; line-height: 1.7; }

.creator-cta { padding-block: 26px 100px; background: #fff; }
.creator-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; overflow: hidden; padding: clamp(42px, 6vw, 72px); border-radius: 28px; color: #fff; background: radial-gradient(circle at 80% 0%, rgba(233, 90, 169, .23), transparent 35%), linear-gradient(120deg, #071020, #14244b); box-shadow: 0 28px 80px rgba(11, 21, 42, .2); }
.creator-cta h2 { color: #fff; }
.creator-cta .creator-kicker { color: var(--creator-gold-light); }
.creator-cta__inner > div > p:last-child { color: rgba(255, 255, 255, .67); }
.creator-cta .creator-button { flex: 0 0 auto; }

@media (max-width: 900px) {
    .creator-hero { min-height: auto; background-position: right bottom; background-size: auto 46%; }
    .creator-hero::before {
        background: linear-gradient(180deg, rgba(4, 10, 23, .99) 0%, rgba(4, 10, 23, .95) 56%, rgba(4, 10, 23, .55) 66%, rgba(4, 10, 23, .08) 75%, transparent 82%);
    }
    .creator-hero__layout { grid-template-columns: 1fr; padding-block: 78px 330px; }
    .creator-seal { display: none; }
    .creator-highlights__grid { grid-template-columns: repeat(2, 1fr); }
    .creator-highlights article:nth-child(2) { border-right: 0; }
    .creator-highlights article:nth-child(-n+2) { border-bottom: 1px solid #e8e3d9; }
    .creator-section-heading--split { display: grid; align-items: start; }
    .creator-year-picker { min-width: 0; max-width: 310px; }
    .creator-podium { grid-template-columns: 1fr; align-items: stretch; margin-top: 35px; }
    .creator-podium__card,
    .creator-podium__card--1 { order: initial; min-height: 0; transform: none; }
    .creator-podium[data-count='2'] { grid-template-columns: 1fr; }
    .creator-podium[data-count='2'] .creator-podium__card--1,
    .creator-podium[data-count='2'] .creator-podium__card--2 { order: initial; }
    .creator-levels__grid { grid-template-columns: 1fr; }
    .creator-level-card { min-height: 260px; }
    .creator-level-card__medal { margin-bottom: 32px; }
    .creator-contributions__layout,
    .creator-faq__layout { grid-template-columns: 1fr; }
    .creator-contributions__intro { position: static; }
    .creator-cta__inner { display: grid; }
    .creator-cta .creator-button { justify-self: start; }
}

@media (max-width: 620px) {
    .creator-shell { width: min(100% - 28px, 1180px); }
    .creator-hero { background-size: auto 44%; }
    .creator-hero__layout { padding-block: 64px 310px; }
    .creator-hero h1 { font-size: clamp(44px, 14vw, 62px); letter-spacing: -.065em; }
    .creator-hero__lead { font-size: 16px; }
    .creator-hero__actions { display: grid; }
    .creator-button { width: 100%; }
    .creator-hero__trust { display: grid; gap: 10px; }
    .creator-highlights { margin-top: -48px; }
    .creator-highlights article { padding: 20px; }
    .creator-highlights strong { font-size: 28px; }
    .creator-ranking,
    .creator-levels,
    .creator-contributions,
    .creator-faq { padding-block: 76px; }
    .creator-section-heading { margin-bottom: 38px; }
    .creator-podium__card { padding-inline: 22px; }
    .creator-table th,
    .creator-table td { padding-inline: 15px; white-space: nowrap; }
    .creator-level-card { padding: 27px; }
    .creator-rules article { grid-template-columns: 48px 1fr; padding: 17px; }
    .creator-rules article > span { width: 44px; height: 44px; }
    .creator-cta { padding-bottom: 70px; }
    .creator-cta__inner { padding: 34px 24px; border-radius: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .creator-page *,
    .creator-page *::before,
    .creator-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}