.creators-page { background:var(--paper); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.creators-topbar { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:24px max(24px,5vw); background:var(--navy); color:white; }
.creators-topbar img { display:block; width:165px; height:auto; }
.creator-button { display:inline-flex; justify-content:center; align-items:center; gap:10px; padding:15px 24px; border:2px solid var(--navy); border-radius:6px; background:var(--pink); color:var(--navy); font:900 1rem Nunito,Arial,sans-serif; text-decoration:none; cursor:pointer; box-shadow:4px 4px 0 var(--navy); }
.creator-button:hover { background:var(--yellow); }
.creator-button:disabled { opacity:.55; cursor:wait; }
.creators-hero { display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:40px; padding:64px max(24px,7vw); min-height:580px; background:var(--yellow) url('/img/skull-pattern.png') center/500px; }
.creators-hero h1 { font-size:clamp(3rem,6vw,6rem); }
.creators-hero h1 span { color:var(--pink); }
.creators-hero p { max-width:530px; font-weight:800; line-height:1.75; }
.creators-hero > img { width:100%; max-height:470px; object-fit:contain; }
.creators-content { max-width:1180px; margin:auto; padding:72px 32px; }
.creators-content > p { max-width:750px; font-size:1.1rem; line-height:1.8; }
.creators-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:36px; }
.creators-card { overflow:hidden; border-radius:12px; border:1px solid #03112f20; background:white; }
.creators-card-image { display:grid; place-items:center; height:210px; padding:28px; background:var(--yellow); }
.creators-card:nth-child(2) .creators-card-image { background:var(--pink); }
.creators-card:nth-child(3) .creators-card-image { background:var(--navy); }
.creators-card img { max-width:100%; max-height:150px; object-fit:contain; }
.creators-card-copy { padding:24px; }
.creators-card p { color:#566074; line-height:1.7; }
.creators-benefits { background:var(--pink); padding:72px max(24px,7vw); }
.creators-benefits article { display:grid; grid-template-columns:80px 1fr; gap:24px; padding:30px 0; border-bottom:1px solid #03112f30; }
.creators-benefits article > span { font:400 3rem Anton,sans-serif; color:var(--yellow); }
.creators-benefits h3 { font-size:1.5rem; }
.creators-benefits p { max-width:680px; line-height:1.8; }
.creators-join { text-align:center; padding:80px 24px; background:var(--navy) url('/img/skull-pattern.png') center/500px; color:white; }
.creators-join p { max-width:680px; margin:24px auto; line-height:1.8; }
body.brand-page.creator-flow { min-height:100svh; background:#080808; color:white; }
.creator-flow .creators-topbar { background:transparent; }
.creator-flow .creator-button { border-color:#000; color:#000; box-shadow:4px 4px 0 #000; }
.flow-panel { max-width:980px; margin:auto; padding:40px 24px 80px; text-align:center; }
.flow-panel h1 { font-size:clamp(2.5rem,5vw,4.5rem); margin:20px 0; }
.flow-panel > p { color:#c4cad5; line-height:1.7; }
.flow-steps { display:flex; justify-content:center; list-style:none; gap:32px; padding:0; margin:10px 0 40px; font-weight:900; color:#a3adbf; }
.flow-steps [aria-current="step"] { color:var(--yellow); }
.age-value { display:block; width:150px; margin:40px auto 30px; padding:12px; border:1px solid #ffffff40; border-radius:16px; background:#0003; color:white; text-align:center; font:400 3.5rem Anton,sans-serif; }
.age-slider { display:block; width:100%; margin:30px 0 10px; accent-color:var(--pink); cursor:pointer; }
.age-ticks { display:flex; justify-content:space-between; color:#c4cad5; margin-bottom:48px; font-weight:900; }
.platform-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; margin:36px auto; max-width:940px; }
.platform-choice { position:relative; cursor:pointer; }
.platform-choice input { position:absolute; top:12px; left:12px; accent-color:var(--pink); }
.platform-choice span { display:grid; place-items:center; height:100%; min-height:130px; padding:24px 16px; border:3px solid transparent; border-radius:12px; background:white; color:#080808; font-weight:900; font-size:1.1rem; line-height:1.4; }
.platform-choice input:checked + span { border-color:var(--pink); background:var(--yellow); }
.platform-choice:focus-within { outline:3px solid var(--pink); outline-offset:5px; border-radius:12px; }
.creator-fields { display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:760px; margin:0 auto 30px; text-align:left; }
.creator-fields label { display:grid; gap:8px; font-weight:800; }
.creator-fields input { width:100%; padding:14px; border:1px solid #ffffff50; border-radius:6px; background:#fff; color:var(--navy); font:inherit; }
.creator-consent { display:flex; align-items:flex-start; gap:12px; max-width:760px; margin:24px auto; text-align:left; font-size:.9rem; line-height:1.6; }
.creator-consent input { flex:0 0 auto; margin-top:6px; accent-color:var(--pink); }
.creator-consent a { text-decoration:underline; }
.creator-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.creator-status { min-height:28px; max-width:760px; margin:24px auto; line-height:1.7; }
.creator-status[data-error="true"] { color:#ffb5cb; }
.creator-success { padding:40px 0; }
.creator-success h2 { color:var(--yellow); }
[hidden] { display:none !important; }
@media(max-width:900px) { .platform-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }.platform-choice { grid-column:span 2; }.platform-choice:nth-child(4) { grid-column:2 / span 2; }.platform-choice:nth-child(5) { grid-column:4 / span 2; } }
@media(max-width:700px) { .creators-topbar { padding:20px; }.creators-topbar img { width:120px; }.creators-topbar .creator-button { padding:10px 12px; font-size:.8rem; }.creators-hero { grid-template-columns:1fr; padding:44px 24px; }.creators-hero > img { max-height:300px; }.creators-cards { grid-template-columns:1fr; }.creators-content { padding:48px 24px; }.creators-benefits article { grid-template-columns:48px 1fr; gap:16px; }.platform-grid { grid-template-columns:1fr 1fr; }.platform-choice,.platform-choice:nth-child(4) { grid-column:auto; }.platform-choice:nth-child(5) { grid-column:1 / -1; justify-self:center; width:calc((100% - 16px) / 2); }.platform-choice span { font-size:1.1rem; min-height:110px; }.creator-fields { grid-template-columns:1fr; }.flow-steps { gap:18px; font-size:.8rem; } }
