/* Canonical PRV landing layout. This file owns hero composition on desktop and mobile. */
.hero-person{
  display:block!important;
  position:absolute!important;
  z-index:5!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
  object-fit:contain!important;
  filter:drop-shadow(0 22px 34px rgba(0,18,91,.18))!important;
}
.hero-copy{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  width:min(900px,50vw)!important;
  z-index:12!important;
  pointer-events:none!important;
}
.hero-copy h1{margin:0!important}
.hero-copy h1 span{white-space:nowrap!important}
.hero-copy .hero-subtitle{
  width:auto!important;
  max-width:none!important;
  margin:20px 0 0!important;
  text-align:left!important;
  white-space:nowrap!important;
}
.hero-copy .cases-cta{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:auto!important;
  min-width:250px!important;
  max-width:none!important;
  height:56px!important;
  margin:26px 0 0!important;
  padding:0 28px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  border:0!important;
  border-radius:14px!important;
  clip-path:none!important;
  background:#ff7900!important;
  background-image:none!important;
  box-shadow:0 9px 22px rgba(0,24,110,.18)!important;
  color:#07113a!important;
  text-decoration:none!important;
  font-size:18px!important;
  font-weight:700!important;
  white-space:nowrap!important;
  pointer-events:auto!important;
}
.hero-copy .cases-cta:before,.hero-copy .cases-cta:after{display:none!important;content:none!important}
.hero-copy .cases-cta:hover{transform:translateY(-2px)!important;filter:brightness(1.035)!important}

@media (min-width:821px){
  .hero-person{
    right:calc(8% + 100px)!important;
    left:auto!important;
    bottom:-11svh!important;
    top:auto!important;
    height:113svh!important;
    width:auto!important;
    max-width:72vw!important;
    transform:translate3d(-14px,226px,0) scale(1.40) rotate(15deg)!important;
    transform-origin:center center!important;
    object-position:right bottom!important;
  }
  .hero-copy{
    top:61.5%!important;
  }
  .hero-copy h1{
    font-size:clamp(46px,3.65vw,70px)!important;
    line-height:.90!important;
    letter-spacing:-.038em!important;
    text-shadow:0 2px 0 rgba(255,255,255,.18),0 5px 0 rgba(7,43,139,.46),0 13px 30px rgba(0,18,94,.76),0 2px 4px rgba(0,0,0,.40)!important;
  }
  .hero-copy .hero-subtitle{
    text-shadow:0 5px 18px rgba(0,16,91,.90),0 2px 4px rgba(0,0,0,.52)!important;
  }
  .topbar{z-index:20!important}
}

@media (max-width:820px){
  html,body{
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
    background:#0642d4!important;
  }
  body{position:fixed!important;inset:0!important}
  .landing{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    height:100svh!important;
    min-height:100svh!important;
    overflow:hidden!important;
  }
  .topbar{
    height:auto!important;
    padding:max(14px,env(safe-area-inset-top)) 16px 0!important;
    display:grid!important;
    grid-template-columns:1fr auto!important;
    grid-template-rows:44px auto!important;
    gap:8px 12px!important;
    align-items:center!important;
    z-index:20!important;
  }
  .brand{
    width:118px!important;
    height:44px!important;
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
    margin:0!important;
  }
  .telegram-cta{
    grid-column:2!important;
    grid-row:1!important;
    align-self:center!important;
    min-width:0!important;
    height:44px!important;
    margin:0!important;
    padding:0 12px!important;
    gap:8px!important;
    font-size:12px!important;
  }
  .telegram-icon{width:18px!important;height:18px!important}
  .main-nav{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    padding:6px 0 0!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
    align-self:start!important;
    align-items:center!important;
  }
  .main-nav a{
    min-width:0!important;
    min-height:44px!important;
    padding:0 3px!important;
    border-top:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:center!important;
    font-size:10.5px!important;
    font-weight:600!important;
  }
  .main-nav a:after{display:none!important}
  .hero-bg{
    left:0!important;
    top:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
  .hero-scene{
    left:50%!important;
    top:29.5%!important;
    width:128vw!important;
    height:72vw!important;
    max-width:none!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .hero-word{
    left:50%!important;
    top:50%!important;
    width:106%!important;
    height:106%!important;
    object-fit:contain!important;
    filter:drop-shadow(0 17px 28px rgba(0,16,88,.24))!important;
    transform:translate(-50%,-50%) translate3d(var(--gyro-x,0px),var(--gyro-y,0px),0)!important;
    transition:transform .10s ease-out!important;
    will-change:transform!important;
  }
  .hero-person{
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:-1.5svh!important;
    height:83svh!important;
    width:auto!important;
    max-width:118vw!important;
    transform:translateX(-50%)!important;
    object-position:center bottom!important;
    filter:drop-shadow(0 22px 32px rgba(0,15,85,.20))!important;
  }
  .hero-copy{
    left:20px!important;
    right:20px!important;
    top:auto!important;
    bottom:max(50px,calc(env(safe-area-inset-bottom) + 28px))!important;
    width:auto!important;
    max-width:none!important;
    align-items:center!important;
    text-align:center!important;
  }
  .hero-copy h1,.hero-copy h1 span{
    width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
  }
  .hero-copy h1{
    font-size:clamp(25px,7.8vw,34px)!important;
    line-height:.92!important;
    letter-spacing:-.038em!important;
    text-shadow:0 2px 0 rgba(255,255,255,.20),0 4px 0 rgba(4,38,132,.52),0 9px 22px rgba(0,13,78,.94),0 2px 5px rgba(0,0,0,.65)!important;
  }
  .hero-copy .hero-subtitle{
    width:100%!important;
    max-width:94%!important;
    margin:15px auto 0!important;
    text-align:center!important;
    white-space:normal!important;
    font-size:clamp(12.5px,3.55vw,15px)!important;
    line-height:1.22!important;
    text-shadow:0 4px 15px rgba(0,11,76,.98),0 2px 4px rgba(0,0,0,.72)!important;
  }
  .hero-copy .cases-cta{
    min-width:238px!important;
    height:54px!important;
    margin-top:20px!important;
    padding:0 24px!important;
    border-radius:14px!important;
    font-size:16px!important;
  }
  .landing:after{background:linear-gradient(180deg,rgba(0,20,108,.06) 0,transparent 47%,rgba(0,24,128,.10) 60%,rgba(0,18,97,.52) 100%)!important}
}

@media (max-width:480px){
  .topbar{
    grid-template-rows:44px auto!important;
    padding-left:12px!important;
    padding-right:12px!important;
    gap:7px 8px!important;
  }
  .brand{width:105px!important;height:44px!important}
  .telegram-cta{height:44px!important;padding:0 9px!important;font-size:11px!important}
  .telegram-icon{width:16px!important;height:16px!important}
  .main-nav{gap:3px!important;padding-top:5px!important}
  .main-nav a{min-height:44px!important;font-size:9.5px!important;padding:0 2px!important}
  .hero-scene{top:29%!important;width:132vw!important;height:74.25vw!important}
  .hero-person{bottom:-1svh!important;height:82svh!important;max-width:122vw!important}
  .hero-copy{
    left:16px!important;
    right:16px!important;
    bottom:max(48px,calc(env(safe-area-inset-bottom) + 26px))!important;
  }
  .hero-copy h1{font-size:clamp(24px,7.5vw,31px)!important}
  .hero-copy .hero-subtitle{max-width:96%!important;margin-top:13px!important}
  .hero-copy .cases-cta{
    min-width:226px!important;
    height:52px!important;
    margin-top:18px!important;
    padding:0 22px!important;
    font-size:15.5px!important;
  }
}

@media (max-width:820px) and (max-height:700px){
  .hero-scene{top:28.5%!important;width:118vw!important;height:66.4vw!important}
  .hero-person{height:80svh!important;bottom:-2svh!important}
  .hero-copy{bottom:max(38px,env(safe-area-inset-bottom))!important}
  .hero-copy h1{font-size:clamp(23px,7vw,30px)!important}
  .hero-copy .hero-subtitle{margin-top:10px!important;font-size:11.5px!important}
  .hero-copy .cases-cta{height:48px!important;margin-top:14px!important}
}

@media(prefers-reduced-motion:reduce){.hero-word{transition:none!important}}
@media(max-width:820px) and (prefers-reduced-motion:reduce){.hero-word{transform:translate(-50%,-50%)!important}}