.hero{position:fixed;inset:0;z-index:100;background:#2c6fa8;overflow:hidden;touch-action:none;cursor:grab;
  transition:opacity .55s ease,transform .55s ease}
.hero.dragging{cursor:grabbing}
.hero.leaving{opacity:0;transform:scale(1.06);pointer-events:none}
.hero[hidden]{display:none}
#heroCv,#heroCv2{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-logo{--t:translate(-50%,-50%);transform:var(--t);position:absolute;left:0;top:0;width:100px;pointer-events:none;opacity:0}
.hl-in{position:relative;width:100%;filter:drop-shadow(0 .5rem .7rem rgba(10,40,80,.45))}
.hl-in img{display:block;width:100%;height:auto}
.hero-logo.show{opacity:1;animation:logoPop .9s cubic-bezier(.2,1.5,.4,1) both}
@keyframes logoPop{0%{opacity:0;transform:var(--t) scale(.35) rotate(-6deg)}55%{opacity:1;transform:var(--t) scale(1.12) rotate(1.5deg)}100%{opacity:1;transform:var(--t) scale(1) rotate(0)}}
.hero-flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 70%,rgba(255,255,255,.95),rgba(255,255,255,0) 65%);opacity:0}
.hero.intro .hero-flash{animation:flash 1.3s ease-out both}
@keyframes flash{0%{opacity:.95}100%{opacity:0}}
.hero-enter{position:absolute;left:50%;top:70%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;justify-content:center;gap:.5rem;
  height:44px;padding:0 1.5rem;border:.09rem solid rgba(255,255,255,.85);border-radius:2rem;cursor:pointer;white-space:nowrap;
  font-family:inherit;color:#fff;background:rgba(18,52,92,.22);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  text-shadow:0 .08rem .35rem rgba(10,30,60,.65);opacity:0;pointer-events:none}
.hero.logo-in .hero-enter{pointer-events:auto;animation:enterIn .6s ease forwards,enterPulse 2.4s ease-in-out 1s infinite}
.hero-enter b{font-size:1.2rem;font-weight:800;letter-spacing:.3em;margin-right:-.3em}
.hero-enter .he-ic,.hero-enter small{display:none}
.hero-enter:active{background:rgba(255,255,255,.28)}
@keyframes enterIn{to{opacity:1}}
@keyframes enterPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.0)}50%{box-shadow:0 0 .9rem .1rem rgba(255,255,255,.45)}}
.hero-hint{position:absolute;left:50%;top:calc(env(safe-area-inset-top,0px) + .8rem);transform:translateX(-50%);z-index:3;
  background:rgba(20,50,80,.55);color:#fff;border-radius:1rem;padding:.35rem .9rem;font-size:.8rem;font-weight:700;opacity:0;
  transition:opacity .4s;pointer-events:none;white-space:nowrap}
.hero-hint.show{opacity:1}
@media (orientation:landscape) and (max-height:520px){
  .hero-hint{top:.6rem}
}

.hero-wipe{position:fixed;inset:0;z-index:120;pointer-events:none;display:block;width:100%;height:100%}