/* Activation protocol — consumer activation, three layered accents in one system:
   01 tap = drop cyan · 02 authenticate = M424 amber · 03 claim = infrastructure mint.
   When nested inside .sy-system--joined, section chrome collapses into the parent. */
.sy-protocol{
  position:relative;
  padding:100px 0;
  background:
    linear-gradient(180deg,transparent 0%,rgba(17,19,23,0.55) 18%,rgba(17,19,23,0.55) 82%,transparent 100%);
}

.sy-protocol--joined{
  padding:36px 0 0;
  background:none;
  scroll-margin-top:88px;
}

.sy-activation-head{
  margin-bottom:28px;
  text-align:center;
}
.sy-activation-title{
  margin:10px 0 0;
  font-family:var(--font-serif);
  font-size:clamp(1.55rem,3.2vw,2.15rem);
  font-weight:500;
  letter-spacing:-0.02em;
  color:var(--sy-text);
}

.sy-steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

/* Compact strip inside the joined composition — denser, still premium */
.sy-steps--strip .sy-step{
  padding:24px 22px 22px;
}
.sy-steps--strip .sy-step h3{
  font-size:1.08rem;
}
.sy-steps--strip .sy-step p{
  margin-top:8px;
  font-size:0.9rem;
  line-height:1.45;
}
.sy-steps--strip .sy-cipher{
  margin-top:16px;
}

.sy-step{
  position:relative;
  padding:30px 26px 26px;
  background:rgba(10,10,12,0.5);
  border:1px solid var(--sy-border-subtle);
  border-top:1px solid var(--sy-border);
  overflow:hidden;
}
.sy-step::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:56px;
  height:1px;
}
.sy-step--tap::before{background:var(--sy-cyan);box-shadow:var(--sy-glow-cyan)}
.sy-step--auth::before{background:var(--sy-amber);box-shadow:0 0 14px rgba(245,160,60,0.4)}
.sy-step--claim::before{background:var(--sy-mint);box-shadow:var(--sy-glow-mint)}

.sy-step-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:18px;
}
.sy-step-index{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:0.2em;
  color:var(--sy-faint);
}
.sy-step-glyph svg{width:40px;height:40px;display:block}

.sy-step h2,
.sy-step h3{
  font-size:1.18rem;
  font-weight:600;
  letter-spacing:-0.01em;
  color:var(--sy-text);
}
.sy-step p{
  margin-top:10px;
  font-size:0.95rem;
  color:var(--sy-dim);
}

.sy-cipher{
  display:inline-flex;
  margin-top:20px;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  position:relative;
}
.sy-cipher .cx-redacted{color:var(--sy-faint);transition:opacity var(--sy-fast) var(--sy-ease)}
.sy-cipher .cx-clear{
  position:absolute;
  inset:0;
  opacity:0;
  white-space:nowrap;
  transition:opacity var(--sy-fast) var(--sy-ease);
}
.sy-step--tap .cx-clear{color:var(--sy-cyan)}
.sy-step--auth .cx-clear{color:var(--sy-amber)}
.sy-step--claim .cx-clear{color:var(--sy-mint)}
.sy-step:hover .cx-redacted{opacity:0}
.sy-step:hover .cx-clear{opacity:1}
@media (prefers-reduced-motion: reduce){
  .sy-cipher .cx-redacted{display:none}
  .sy-cipher .cx-clear{position:static;opacity:1}
}

.sy-protocol-close{
  margin-top:52px;
  text-align:center;
}
.sy-system--joined .sy-protocol-close{
  margin-top:48px;
}
.sy-protocol-close .line{
  font-family:var(--font-serif);
  font-size:clamp(1.3rem,2.6vw,1.8rem);
  font-weight:400;
  color:var(--sy-ice);
}
.sy-protocol-close .line em{
  font-style:italic;
  color:var(--sy-cyan);
}
.sy-protocol-close .sub{
  display:block;
  margin-top:10px;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--sy-faint);
}
.sy-protocol-close .sub b{
  color:var(--sy-dim);
  font-weight:500;
}
.sy-faq-more{margin-top:32px}

@media (max-width:860px){
  .sy-steps{grid-template-columns:1fr}
  .sy-sys-bridge{
    flex-direction:column;
    gap:12px;
    margin:44px 0 4px;
  }
  .sy-sys-bridge-line{width:min(120px,40vw);max-width:none;flex:none}
}