/* Official Discord symbol beside the hero's platform label. */
.hero .community-discord-label{display:inline-flex;align-items:center;justify-content:center;gap:14px;max-width:100%;line-height:1.6}
.hero .community-discord-mark{display:block;flex:none;width:40px;height:30px;object-fit:contain}

/* Flat, transparent rating link with Trustpilot's original green star artwork. */
.community-trustpilot{display:inline-flex;align-items:center;justify-content:center;padding:4px 0;margin:0;max-width:100%;border:0;background:transparent;color:#dfe6ee;text-decoration:none;box-shadow:none}
.community-trustpilot-rating{display:grid;justify-items:center;gap:4px;line-height:1.5;font-size:10px;text-align:center}
.community-trustpilot-stars{display:block;width:90px;height:16.875px;object-fit:contain}
.community-trustpilot-rating strong{font-weight:650;color:#fff}
@media(hover:hover){.community-trustpilot:hover{color:#fff}}

/* The original invitation steps, retained within Claude's community design. */
.c-steps-section{padding-top:24px;padding-bottom:clamp(120px,13vw,180px)}
.c-steps-heading h2{font-size:clamp(32px,3.8vw,44px);font-weight:500;line-height:1.2;letter-spacing:-.035em;margin:0}
.c-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:35px}
.c-step-number{display:flex;align-items:center;gap:23px;margin-bottom:21px;font-size:14px;color:#78bdff}
.c-step-number i{height:1px;flex:1;background:linear-gradient(90deg,#559fff66,#559fff0a)}
.c-steps h3{font-size:21px;font-weight:500;line-height:1.3;margin-bottom:12px}
.c-steps p{font-size:15px;line-height:1.8;max-width:32ch;color:var(--muted)}

/* Keep the live signup accessible without changing the prototype's layout. */
.lead-card-body{display:contents}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:-80px;z-index:100;background:#fff;color:#090c12;padding:10px 18px;border-radius:6px}
.skip-link:focus{top:12px}
.row input[aria-invalid=true]{box-shadow:inset 0 -1px #eab8b1}
.row .btn:disabled{cursor:wait;opacity:.7}
.hero .status{font-size:12px;color:#eab8b1;line-height:1.5;text-align:left}
.accordion-panel{display:flow-root}
.faq details[data-expanded=false] summary::after{content:'+';transform:none}
.faq details[data-expanded=true] summary::after{content:'−';transform:none}
.faq a{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:650px){
 .c-steps-section{padding-top:10px;padding-bottom:88px}
 .c-steps{grid-template-columns:1fr;gap:25px;margin-top:28px}
 .c-steps article{display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:18px}
 .c-step-number{grid-row:1/3;display:block;margin:3px 0 0}
 .c-step-number i{display:none}
 .c-steps h3{font-size:20px}
 .c-steps p{font-size:14px;max-width:none}
}

/* Screenshots are static evidence, with no link or hover affordance. */
.redesigned-community .review,.redesigned-community .win{margin:0;cursor:default;transition:none}
.redesigned-community .review:hover,.redesigned-community .win:hover{border-color:#3d9bff40;transform:none;box-shadow:none}

/* Preserve original screenshot proportions. */
.redesigned-community .earning img{max-height:600px}
@media(max-width:700px){.redesigned-community .earning img{max-height:none}}

/* Compact, consistent screenshot frames on desktop and tablet. */
@media(min-width:701px){
 .redesigned-community .wins{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch;max-width:1120px;margin-inline:auto}
 .redesigned-community .win,.redesigned-community .win.wide{grid-column:auto;position:relative;aspect-ratio:4/3}
 .redesigned-community .win img{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);max-height:none;object-fit:contain}
}
@media(min-width:1024px){.redesigned-community .wins{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Compact community benefits stay together on small screens. */
.hero .notes.community-benefits{flex-wrap:nowrap;gap:10px;font-size:12px;white-space:nowrap}
.hero .notes.community-benefits span{gap:10px}
.hero .notes.community-benefits span:first-child::before{display:none}
@media(max-width:400px){
 .hero .notes.community-benefits{gap:7px;font-size:11px;letter-spacing:-.1px}
 .hero .notes.community-benefits span{gap:7px}
}
