/* =============================================================
   Páginas de conexão dos sócios da h|ve
   Tokens do :root de hybridvelocity.com. Não invente cores aqui.
   ============================================================= */

.hve-perfil{
  --ink:#0a0a0a;
  --muted:#8d8d8d;
  --subtle:#b6b6b6;
  --accent:#b15f2c;
  --bar:#ff6d04;
  --hero-from:#ecebe9;
  --hero-to:#c9c9c9;
  --r-sm:1.25rem;
  --r-pill:9999px;

  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:Onest,"Helvetica Neue",Helvetica,Arial,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;

  --logo-src:url("logo-hve.png");

  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(168deg,var(--hero-from) 0%,#dedcd9 46%,var(--hero-to) 100%);
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
}
.hve-perfil *{box-sizing:border-box}

/* ============ atmosfera ============ */
.hve-perfil .halo{position:absolute;border-radius:50%;filter:blur(52px);pointer-events:none;z-index:0}
.hve-perfil .halo-a{width:280px;height:280px;top:-80px;right:-90px;
  background:radial-gradient(circle,rgba(255,109,4,.5),rgba(255,109,4,0) 70%);
  animation:hve-drift-a 19s ease-in-out infinite}
.hve-perfil .halo-b{width:250px;height:250px;bottom:20px;left:-110px;
  background:radial-gradient(circle,rgba(177,95,44,.4),rgba(177,95,44,0) 70%);
  animation:hve-drift-b 23s ease-in-out infinite}
@keyframes hve-drift-a{50%{transform:translate(-40px,52px) scale(1.14)}}
@keyframes hve-drift-b{50%{transform:translate(46px,-38px) scale(1.1)}}

.hve-perfil .watermark{position:absolute;z-index:0;pointer-events:none;user-select:none;
  left:50%;top:300px;transform:translateX(-50%);text-align:center}
.hve-perfil .wm-main{font-size:150px;font-weight:900;letter-spacing:-.07em;line-height:.8;
  color:rgba(10,10,10,.07);display:flex;align-items:center;justify-content:center}
.hve-perfil .wm-main i{font-style:normal;color:rgba(255,109,4,.18);padding:0 .04em}

/* ============ superfície ============ */
.hve-perfil .page{position:relative;z-index:1;height:100%;
  overflow-y:auto;overflow-x:hidden;scrollbar-width:none;
  display:flex;flex-direction:column;padding:0 18px 24px}
.hve-perfil .page::-webkit-scrollbar{display:none}

.hve-perfil .head{position:sticky;top:0;z-index:5;margin:0 -18px;padding:13px 18px 11px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:rgba(240,239,236,0);
  transition:background .32s,box-shadow .32s,backdrop-filter .32s}
.hve-perfil .head.stuck{background:rgba(243,242,240,.74);
  backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);
  box-shadow:0 1px 0 rgba(10,10,10,.06),0 8px 22px -14px rgba(10,10,10,.3)}

/* sprite 1454×257 fatiado em 5, igual ao site */
.hve-perfil .logo-morph{--lm-h:2.25rem;--lm-k:calc(var(--lm-h) / 257);
  height:var(--lm-h);display:inline-flex;align-items:center;flex:0 0 auto}
.hve-perfil .logo-morph i{display:block;flex:0 0 auto;height:var(--lm-h);
  background-image:var(--logo-src);background-repeat:no-repeat;
  background-size:calc(1454 * var(--lm-k)) var(--lm-h);
  transition:width .55s cubic-bezier(.22,1,.36,1),margin .55s cubic-bezier(.22,1,.36,1),
             transform .55s cubic-bezier(.22,1,.36,1),opacity .3s}
.hve-perfil .logo-morph .lm-h     {width:calc(95  * var(--lm-k));background-position:calc(-50  * var(--lm-k)) 0}
.hve-perfil .logo-morph .lm-ybrid {width:calc(439 * var(--lm-k));background-position:calc(-151 * var(--lm-k)) 0}
.hve-perfil .logo-morph .lm-bar   {width:calc(32  * var(--lm-k));background-position:calc(-653 * var(--lm-k)) 0;margin-inline:calc(64 * var(--lm-k))}
.hve-perfil .logo-morph .lm-ve    {width:calc(204 * var(--lm-k));background-position:calc(-746 * var(--lm-k)) 0}
.hve-perfil .logo-morph .lm-locity{width:calc(473 * var(--lm-k));background-position:calc(-962 * var(--lm-k)) 0}
.hve-perfil .logo-morph.is-compact .lm-ybrid,
.hve-perfil .logo-morph.is-compact .lm-locity{width:0;opacity:0}
.hve-perfil .logo-morph.is-compact .lm-bar{margin-inline:calc(23 * var(--lm-k));transform:scaleY(4.5)}

.hve-perfil .head-pill{font-family:var(--mono);font-size:9px;text-transform:uppercase;
  letter-spacing:.13em;color:var(--accent);display:flex;align-items:center;gap:6px;
  padding:6px 11px;background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.7);
  border-radius:var(--r-pill);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  white-space:nowrap}
.hve-perfil .dot{width:5px;height:5px;border-radius:50%;background:var(--bar);flex:0 0 auto}
.hve-perfil .dot.live{animation:hve-pulse 2.4s ease-in-out infinite}
@keyframes hve-pulse{50%{opacity:.35;transform:scale(.8)}}

/* ============ identidade ============ */
.hve-perfil .id{display:flex;align-items:center;gap:15px;padding:22px 2px 16px}
.hve-perfil .retrato{
  flex:0 0 auto;width:74px;height:74px;border-radius:22px;
  display:grid;place-items:center;overflow:hidden;
  background:rgba(255,255,255,.52);
  border:1px solid rgba(255,255,255,.8);
  backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);
  box-shadow:0 10px 26px -14px rgba(10,10,10,.45);
  font-size:23px;font-weight:900;letter-spacing:-.05em;color:var(--accent);
}
.hve-perfil .retrato img{width:100%;height:100%;object-fit:cover;display:block}
.hve-perfil .id-txt{min-width:0}
.hve-perfil .cargo{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--mono);font-size:8.5px;text-transform:uppercase;letter-spacing:.14em;
  color:var(--accent);margin-bottom:7px;padding:3px 8px;border-radius:var(--r-pill);
  background:rgba(255,109,4,.1);border:1px solid rgba(177,95,44,.35);
}
.hve-perfil h1{font-size:26px;font-weight:900;line-height:1.06;letter-spacing:-.04em;
  margin:0;text-wrap:balance}
.hve-perfil .tag{font-size:12px;color:#4a4744;margin:7px 0 0;line-height:1.45}
.hve-perfil .tag em{font-family:var(--serif);font-style:italic;color:var(--accent);font-size:13px}

/* ============ ações ============ */
.hve-perfil .acts{display:flex;flex-direction:column;gap:8px;padding-top:4px}
.hve-perfil .act{
  display:grid;grid-template-columns:36px minmax(0,1fr) 18px;align-items:center;gap:12px;
  padding:12px 14px;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.72);border-radius:var(--r-sm);
  backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);
  box-shadow:0 1px 2px rgba(10,10,10,.04),0 10px 26px -18px rgba(10,10,10,.4);
  transition:transform .26s cubic-bezier(.22,1,.36,1),background .26s,border-color .26s,box-shadow .26s;
}
.hve-perfil .act:hover,.hve-perfil .act:focus-visible{transform:translateY(-2px);
  background:rgba(255,255,255,.68);border-color:rgba(255,255,255,.95);
  box-shadow:0 2px 4px rgba(10,10,10,.05),0 18px 34px -20px rgba(10,10,10,.5)}
.hve-perfil .act:focus-visible{outline:2px solid var(--bar);outline-offset:2px}
.hve-perfil .act.primary{
  background:linear-gradient(135deg,rgba(255,109,4,.93),rgba(207,128,71,.9));
  border-color:rgba(255,140,60,.6);color:#fff;
  box-shadow:0 2px 4px rgba(151,80,31,.2),0 14px 30px -16px rgba(177,95,44,.75)}
.hve-perfil .act.primary:hover{background:linear-gradient(135deg,rgba(255,124,26,.97),rgba(214,137,82,.95))}
.hve-perfil .a-ico{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;
  background:rgba(10,10,10,.045);color:var(--ink)}
.hve-perfil .a-ico svg{width:17px;height:17px;display:block}
.hve-perfil .act.primary .a-ico{background:rgba(255,255,255,.2);color:#fff}
.hve-perfil .a-t{display:block;font-size:14px;font-weight:700;letter-spacing:-.015em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hve-perfil .a-s{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.05em;
  color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hve-perfil .act.primary .a-s{color:rgba(255,255,255,.85)}
.hve-perfil .a-ar{color:var(--subtle);display:grid;place-items:center;transition:transform .26s}
.hve-perfil .a-ar svg{width:15px;height:15px;display:block}
.hve-perfil .act:hover .a-ar{transform:translateX(3px)}
.hve-perfil .act.primary .a-ar{color:rgba(255,255,255,.85)}

/* ============ onde eu ajudo ============ */
.hve-perfil .help{margin-top:20px;padding:15px 16px;
  background:rgba(255,255,255,.36);border:1px solid rgba(255,255,255,.6);
  border-radius:var(--r-sm);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.hve-perfil .help-h{font-family:var(--mono);font-size:8.5px;text-transform:uppercase;
  letter-spacing:.15em;color:var(--accent);margin-bottom:10px}
.hve-perfil .help ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.hve-perfil .help li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;
  align-items:start;font-size:12px;line-height:1.4;color:#3e3b38}
.hve-perfil .help li::before{content:"";width:5px;height:5px;border-radius:50%;
  background:var(--bar);margin-top:6px}

/* ============ empresa e rodapé ============ */
.hve-perfil .org{margin-top:14px;display:grid;grid-template-columns:minmax(0,1fr) 18px;
  align-items:center;gap:12px;padding:13px 15px;text-decoration:none;color:inherit;
  background:rgba(10,10,10,.045);border:1px solid rgba(10,10,10,.08);border-radius:var(--r-sm);
  transition:background .24s,border-color .24s}
.hve-perfil .org:hover{background:rgba(10,10,10,.07);border-color:rgba(10,10,10,.14)}
.hve-perfil .org:focus-visible{outline:2px solid var(--bar);outline-offset:2px}
.hve-perfil .org-t{display:block;font-size:12.5px;font-weight:700;letter-spacing:-.01em}
.hve-perfil .org-s{display:block;font-family:var(--mono);font-size:8.5px;text-transform:uppercase;
  letter-spacing:.11em;color:var(--muted);margin-top:3px}
.hve-perfil .org svg{width:15px;height:15px;color:var(--subtle)}

.hve-perfil .foot{margin-top:auto;padding:22px 4px 0;text-align:center}
.hve-perfil .foot-rule{height:1px;margin-bottom:14px;
  background:linear-gradient(90deg,transparent,rgba(10,10,10,.13),transparent)}
.hve-perfil .foot-meta{font-family:var(--mono);font-size:8.5px;text-transform:uppercase;
  letter-spacing:.15em;color:var(--subtle)}

@media (prefers-reduced-motion:reduce){
  .hve-perfil *,.hve-perfil *::before,.hve-perfil *::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important}
}