.sect{position:fixed;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;will-change:opacity,transform}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.42em;
  color:var(--cyan);margin-bottom:22px}
.eyebrow::before{content:'// '}

#heroSec .inner{text-align:center;padding:0 6vw;max-width:1200px}
#heroName{font-family:'Archivo Black','Archivo',sans-serif;
  font-size:clamp(2.6rem,9.2vw,8rem);line-height:.96;letter-spacing:-.015em;
  text-transform:uppercase;color:var(--ink)}
#heroName .word{display:block;overflow:hidden}
#heroName .ltr{display:inline-block;transform:translateY(110%) rotate(3deg);opacity:0;
  transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .7s ease}
#heroSec.on .ltr{transform:translateY(0) rotate(0);opacity:1}
#heroSub{margin-top:26px;font-size:clamp(.95rem,1.4vw,1.15rem);font-weight:400;
  color:var(--dim);max-width:560px;margin-left:auto;margin-right:auto;line-height:1.7}
#heroRole{margin-top:18px;font-family:'JetBrains Mono',monospace;font-size:12px;
  letter-spacing:.5em;color:var(--blue);text-transform:uppercase}
.heroRule{width:1px;height:64px;margin:34px auto 0;
  background:linear-gradient(var(--cyan),transparent)}

#diveSec .inner{text-align:center}
#diveSec h3{font-family:'JetBrains Mono',monospace;font-weight:400;font-size:clamp(.8rem,1.6vw,1rem);
  letter-spacing:.55em;color:var(--cyan);text-transform:uppercase}
#diveSec p{margin-top:14px;font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.3em;color:var(--dim)}

#socialSec .inner{text-align:center;padding:0 5vw;width:100%}
#socialSec h2{font-family:'Archivo Black',sans-serif;font-size:clamp(1.8rem,4.5vw,3.4rem);
  text-transform:uppercase;letter-spacing:-.01em}
#socialSec .sub{margin-top:12px;color:var(--dim);font-size:.95rem}
.cards{margin-top:48px;display:flex;gap:22px;justify-content:center;flex-wrap:wrap}
.card{width:200px;padding:34px 22px 28px;text-decoration:none;color:var(--ink);
  background:linear-gradient(170deg,rgba(18,26,38,.7),rgba(8,12,18,.55));
  border:1px solid var(--line);backdrop-filter:blur(14px);position:relative;overflow:hidden;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .45s,box-shadow .45s}
.card svg{width:30px;height:30px;stroke:var(--ink);fill:none;stroke-width:1.4;
  transition:stroke .4s,filter .4s}
.card .cname{margin-top:18px;font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.3em;text-transform:uppercase}
.card .chandle{margin-top:8px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.08em;color:var(--dim)}
.card::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .45s;
  background:radial-gradient(circle at 50% 0%,rgba(111,227,255,.14),transparent 70%)}
.card:hover{transform:translateY(-8px);border-color:rgba(111,227,255,.45);
  box-shadow:0 18px 50px -18px rgba(77,163,255,.35)}
.card:hover svg{stroke:var(--cyan);filter:drop-shadow(0 0 8px rgba(111,227,255,.7))}
.card:hover::after{opacity:1}

#endSec .inner{text-align:center;padding:0 6vw}
#endName{font-family:'Archivo Black',sans-serif;font-size:clamp(2rem,6.5vw,5.4rem);
  text-transform:uppercase;line-height:1;letter-spacing:-.01em}
#endRole{margin-top:16px;font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.5em;color:var(--blue);text-transform:uppercase}
#endQuote{margin-top:34px;font-size:clamp(1rem,1.8vw,1.35rem);color:var(--dim);font-weight:400}
#endQuote em{color:var(--ink);font-style:normal;border-bottom:1px solid rgba(111,227,255,.4)}
.endRule{width:64px;height:1px;background:var(--line);margin:38px auto 0}
#endMono{margin-top:26px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.34em;color:rgba(139,149,165,.6)}