@layer page-header {
  .page-hero{position:relative;overflow:hidden;padding:82px 0 42px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 50% 0,rgba(84,228,204,.08),transparent 34%),linear-gradient(180deg,color-mix(in srgb,var(--bg-2) 62%,transparent),transparent)}
  .page-hero::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--cyan),var(--lime),var(--orange));opacity:.85}
  .page-hero::after{content:"";position:absolute;width:300px;height:300px;left:8%;bottom:-260px;border-radius:40px;background:var(--cyan);opacity:.08;rotate:14deg;pointer-events:none}
  .page-hero .container{position:relative;z-index:1}
  .page-hero h1{max-width:920px;margin-inline:auto}
  .page-hero.compact h1{font-size:clamp(42px,5vw,64px)}
  .page-hero p{max-width:720px;margin:15px auto 0;font-size:16px}
  .page-hero .back-link{display:block;margin-bottom:35px}
}

@layer responsive {
  @media(max-width:650px){.page-hero{padding:60px 0 35px}.page-hero p{font-size:14px}}
}