:root{--bg:#07060b;--green:#46ff67;--cyan:#34eaff;--muted:#bbb8c4}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#fff;font-family:Arial,sans-serif}.skip-link{position:fixed;top:-80px}.skip-link:focus{top:10px;background:#fff;color:#000;padding:12px;z-index:20}header{height:76px;padding:0 clamp(18px,7vw,110px);display:flex;align-items:center;justify-content:space-between;position:absolute;inset:0 0 auto;z-index:5;border-bottom:1px solid #ffffff18}.brand{display:grid;color:#fff;text-decoration:none}.brand small,.directory small{color:var(--green);font-weight:1000;letter-spacing:.18em}.brand strong{font-size:18px}nav{display:flex;gap:22px}nav a{color:#fff;text-decoration:none;text-transform:uppercase;font-size:12px;font-weight:900}nav a.active,nav a:hover{color:var(--green)}.directory-hero{min-height:580px;padding:150px clamp(18px,7vw,110px) 80px;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 80% 20%,#213b60,transparent 28%),radial-gradient(circle at 15% 80%,#43203d,transparent 30%)}.directory-hero>p:first-child{color:var(--green);font-size:11px;font-weight:1000;letter-spacing:.2em}.directory-hero h1{font-size:clamp(54px,8vw,112px);line-height:.88;letter-spacing:-.06em;margin:12px 0 24px}.directory-hero h1 span{color:transparent;-webkit-text-stroke:1px #fff}.directory-hero>p:last-child{max-width:720px;color:#d7d4dc;font-size:19px;line-height:1.6}.directory{max-width:1500px;margin:auto;padding:85px clamp(18px,7vw,110px)}.directory-head{display:flex;align-items:end;justify-content:space-between;gap:25px}.directory h2{font-size:clamp(38px,5vw,70px);margin:8px 0;letter-spacing:-.05em}.directory input{width:min(390px,80vw);min-height:50px;border:1px solid #ffffff2b;border-radius:999px;background:#111018;color:#fff;padding:0 20px;font-size:15px}.directory input:focus{outline:2px solid var(--cyan)}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 10px}.filters button{border:1px solid #ffffff2b;border-radius:999px;background:#111018;color:#fff;padding:10px 15px;font-weight:900;cursor:pointer}.filters button.active{background:var(--green);color:#050505}.directory>p{color:var(--muted)}.creator-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}.creator-card{position:relative;min-height:510px;border-radius:28px;overflow:hidden;border:1px solid #ffffff20;background:#111}.creator-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#050509 2%,transparent 76%)}.creator-card img{width:100%;height:100%;object-fit:cover}.creator-card:first-child img{object-position:60% center}.creator-card[data-name="hyph life"] img{object-position:50% 50%}.creator-card>div{position:absolute;z-index:1;inset:auto 25px 28px}.creator-card h3{font-size:clamp(30px,3vw,45px);margin:8px 0}.creator-card p{color:#ddd;font-weight:800}.creator-follow-count{display:block;width:max-content;margin:8px 0 2px;padding:6px 10px;border:1px solid #ffffff2b;border-radius:999px;background:#08070dbd;color:var(--cyan);font-size:11px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px)}.creator-card a,.join a{display:inline-flex;margin-top:10px;padding:13px 17px;border-radius:999px;background:linear-gradient(90deg,var(--green),var(--cyan));color:#050505;text-decoration:none;text-transform:uppercase;font-size:12px;font-weight:1000}.join{max-width:1280px;margin:0 auto 100px;padding:55px;display:grid;grid-template-columns:1fr 1fr;gap:55px;border-radius:28px;background:linear-gradient(135deg,#14261b,#17111f);border:1px solid #46ff6740}.join h2{font-size:clamp(36px,5vw,62px);line-height:.96;margin:0}.join p{color:#d7d4dc;line-height:1.6}footer{min-height:110px;border-top:1px solid #ffffff18;display:flex;justify-content:space-between;align-items:center;padding:20px clamp(18px,7vw,110px);color:var(--muted)}footer a{color:#fff;text-decoration:none;font-weight:1000}@media(max-width:900px){.creator-grid{grid-template-columns:1fr 1fr}.directory-head{align-items:start;flex-direction:column}.join{margin-inline:18px;grid-template-columns:1fr}}@media(max-width:650px){header{height:66px;padding-inline:15px}.brand strong{font-size:14px}nav{gap:11px}nav a{font-size:10px}.directory-hero{min-height:650px}.creator-grid{grid-template-columns:1fr}.creator-card{min-height:460px}.join{padding:32px 24px}footer{flex-direction:column;align-items:flex-start;gap:10px;padding-block:30px}}
