.creator-intro{margin-top:55px;padding-top:35px;border-top:1px solid var(--line)}.creator-intro h3{font-size:33px;font-weight:400;letter-spacing:-1px;margin:15px 0}.creator-intro p{font-size:12px;line-height:1.7;color:var(--muted);max-width:590px;margin-bottom:25px}.creator-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.creator-preview{aspect-ratio:9/16;position:relative;overflow:hidden;padding:22px 17px;display:flex;flex-direction:column;justify-content:space-between}.creator-top{font-size:8px;letter-spacing:1px;line-height:1.5}.creator-preview small{font-size:7px;letter-spacing:.6px;line-height:1.6}.creator-grid h4{font-size:14px;font-weight:400;margin:16px 0 9px}.creator-grid p{font-size:11px;line-height:1.7;color:var(--muted);margin:0}.hook-preview{background:#ddedaa;color:#29372c}.hook-text{font-size:clamp(33px,4vw,63px);line-height:1;letter-spacing:-2px}.hook-text span{display:block;animation:hook-arrive 6s infinite}.hook-text span:nth-child(1){font-size:12px;letter-spacing:4px;margin-bottom:12px;animation-delay:0s}.hook-text span:nth-child(2){animation-delay:.2s}.hook-text span:nth-child(3){animation-delay:.4s}.caption-preview{background:#333951;color:white}.caption-text{font-size:clamp(28px,3.1vw,48px);font-weight:700;letter-spacing:-1.5px;line-height:1.2}.caption-text b{background:#cfb8f1;color:#26213b;padding:0 7px;display:inline-block;animation:word-pop 5s infinite}.identity-preview{background:#e7ded3;color:#523e32}.creator-avatar{height:110px;width:110px;position:absolute;left:50%;top:26%;transform:translateX(-50%);border-radius:50%;background:#c7ad99;color:#f1e7df;font-family:Georgia,serif;font-size:38px;display:grid;place-items:center}.lower-third{position:absolute;bottom:90px;left:12px;right:12px;border-left:3px solid #614f42;background:#f7f2ed;padding:12px 10px;animation:lower-arrive 7s infinite}.lower-third strong{font-size:12px;display:block}.lower-third span{font-size:8px;display:block;margin-top:4px}.subscribe{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#523e32;color:#faf6f0;font-size:9px;border-radius:20px;padding:10px 14px;animation:follow-pop 7s infinite}.subscribe span{margin-right:8px}.stats-preview{background:#e0e8e8;color:#235453}.stat-head{display:flex;align-items:center;gap:10px;margin-top:15px}.stat-head b{font-size:80px;font-weight:400;letter-spacing:-5px;animation:word-pop 6s infinite}.stat-head span{font-size:16px;line-height:1.2}.creator-bars{display:flex;gap:12px;height:110px;align-items:flex-end;padding:0 8px}.creator-bars b{width:25%;height:35%;background:#80b0a9;transform-origin:bottom;animation:chart-grow 6s infinite}.creator-bars b:nth-child(2){height:60%;background:#518d88;animation-delay:.2s}.creator-bars b:nth-child(3){height:100%;background:#235453;animation-delay:.4s}@keyframes hook-arrive{0%,8%{opacity:0;transform:translateY(30px) rotate(4deg)}18%,82%{opacity:1;transform:none}95%,100%{opacity:0;transform:translateY(-12px)}}@keyframes word-pop{0%,8%{opacity:0;transform:scale(.7)}18%,85%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.9)}}@keyframes lower-arrive{0%,10%{opacity:0;transform:translateX(-40px)}22%,80%{opacity:1;transform:none}95%,100%{opacity:0;transform:translateX(-40px)}}@keyframes follow-pop{0%,30%{opacity:0;translate:0 15px}42%,85%{opacity:1;translate:0 0}100%{opacity:0;translate:0 15px}}@keyframes chart-grow{0%,10%{transform:scaleY(.05);opacity:.3}30%,82%{transform:scaleY(1);opacity:1}100%{transform:scaleY(.05);opacity:.3}}@media(max-width:900px){.creator-grid{grid-template-columns:1fr 1fr;gap:26px 18px}.creator-preview{max-height:440px;aspect-ratio:auto;height:400px}.hook-text{font-size:55px}.caption-text{font-size:40px}}@media(max-width:450px){.creator-preview{height:305px;padding:18px 12px}.hook-text{font-size:40px}.caption-text{font-size:31px}.creator-top{font-size:7px}.creator-preview small{font-size:6px}.creator-avatar{width:80px;height:80px;font-size:30px}.lower-third{bottom:85px;padding:10px 8px}.lower-third strong{font-size:10px}.subscribe{font-size:8px;padding:9px 11px}.stat-head b{font-size:60px}.stat-head span{font-size:12px}.creator-bars{height:90px;gap:8px}.creator-grid h4{font-size:12px}.creator-grid p{font-size:10px}}@media(prefers-reduced-motion:reduce){.creator-preview *{animation:none!important}}
