:root{
  --welcome-panel:rgba(255,255,255,.28);
  --welcome-ink:#243347;
  --welcome-muted:#4f6073;
  --welcome-line:rgba(255,255,255,.55);
  --welcome-shadow:0 14px 36px rgba(17,44,73,.13);
}
.coxy-welcome{
  position:relative;
  isolation:isolate;
  min-height:clamp(500px,68vh,720px);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
  padding:clamp(28px,4vw,54px) 0;
}
.coxy-welcome-main{background-image:url('../images/welcome/coxy-events.webp')}
.coxy-welcome-organizer{background-image:url('../images/welcome/organizer.webp')}
.coxy-welcome-participant{background-image:url('../images/welcome/participant.webp')}
.coxy-welcome-overlay{
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(14,40,74,.24) 0%,rgba(30,75,106,.10) 45%,rgba(10,30,53,.02) 100%);
}
.coxy-welcome-organizer .coxy-welcome-overlay,
.coxy-welcome-participant .coxy-welcome-overlay{
  background:linear-gradient(90deg,rgba(245,250,252,.16) 0%,rgba(230,244,249,.05) 48%,rgba(18,50,74,.01) 100%);
}
.coxy-welcome-inner{display:flex;align-items:center;min-height:inherit}
.coxy-welcome-copy{
  width:min(660px,100%);
  padding:clamp(20px,3vw,30px);
  border:1px solid var(--welcome-line);
  border-radius:20px;
  background:var(--welcome-panel);
  box-shadow:var(--welcome-shadow);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  text-align:left;
}
.coxy-welcome-copy .eyebrow{
  letter-spacing:.10em;
  color:#0877c9;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
}
.coxy-welcome-copy h1{
  margin:6px 0 12px;
  color:var(--welcome-ink);
  font-size:clamp(1.8rem,3.2vw,2.75rem);
  line-height:1.08;
  letter-spacing:-.025em;
  max-width:18ch;
}
.coxy-welcome-copy p{
  margin:0;
  color:var(--welcome-muted);
  font-size:clamp(.96rem,1.15vw,1.08rem);
  line-height:1.55;
  max-width:62ch;
}
.coxy-benefit-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.coxy-benefit-row span{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:6px 11px;
  border-radius:999px;
  border:1px solid rgba(31,116,177,.17);
  background:rgba(246,250,239,.62);
  color:#344354;
  font-size:.82rem;
  font-weight:750;
}
.coxy-role-intro{max-width:700px}
.coxy-role-intro h1{max-width:20ch}
.coxy-role-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin-top:18px;
}
.coxy-role-item{
  padding:11px 12px;
  border-radius:14px;
  border:1px solid rgba(50,103,139,.16);
  background:rgba(255,255,255,.34);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}
.coxy-role-item strong{display:block;margin-bottom:3px;color:#273a4f;font-size:.91rem}
.coxy-role-item span{display:block;color:#56697b;font-size:.82rem;line-height:1.4}
@media(max-width:760px){
  .coxy-welcome{min-height:560px;padding:22px 0;background-position:62% center}
  .coxy-welcome-main{background-position:65% center}
  .coxy-welcome-copy{width:min(94%,660px);margin-inline:auto;padding:20px 18px;border-radius:18px;background:rgba(255,255,255,.42)}
  .coxy-welcome-copy h1{font-size:clamp(1.7rem,8vw,2.45rem)}
  .coxy-role-grid{grid-template-columns:1fr}
  .coxy-benefit-row span{font-size:.78rem}
}
@media(max-width:460px){
  .coxy-welcome{background-position:68% center}
  .coxy-welcome-inner{align-items:flex-start}
  .coxy-welcome-copy{background:rgba(255,255,255,.52)}
}

/* V5.42: keep all three welcome-page titles compact and consistent. */
#coxyWelcomeTitle,
#organizerWelcomeTitle,
#participantWelcomeTitle{
  font-size:clamp(1.45rem,2vw,1.9rem);
  line-height:1.15;
  letter-spacing:-.015em;
  max-width:24ch;
}
@media(max-width:760px){
  #coxyWelcomeTitle,
  #organizerWelcomeTitle,
  #participantWelcomeTitle{
    font-size:clamp(1.35rem,6vw,1.7rem);
    line-height:1.16;
  }
}

/* V5.68: uniform logged-out role authentication actions. */
.coxy-welcome-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:16px;
}
.coxy-welcome-actions .btn{
  min-width:140px;
  justify-content:center;
  text-align:center;
  border-radius:4px!important;
}
@media(max-width:460px){
  .coxy-welcome-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .coxy-welcome-actions .btn{min-width:0;width:100%}
}