/* Signal Noir integration for the autonomous O header renderer. */
.o-home-header{
  position:relative;
  display:grid;
  place-items:center;
  min-height:clamp(430px,68vh,780px);
  padding:clamp(1.25rem,4vw,3rem) 0 clamp(2.5rem,6vw,5rem);
  overflow:hidden;
  border-bottom:1px solid var(--border-subtle);
  isolation:isolate;
}
.o-home-header::before{
  content:"";
  position:absolute;
  inset:8% 8% 4%;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 48%,color-mix(in srgb,var(--accent-fill) 8%,transparent),transparent 30%),
    radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--text-strong) 3%,transparent),transparent 58%);
  filter:blur(8px);
}
.o-header-visual{
  position:relative;
  display:grid;
  place-items:center;
  width:min(100%,760px);
  min-width:0;
  margin-inline:auto;
  background:transparent;
  border:0;
  overflow:visible;
}
.o-header-visual::before{
  content:"";
  position:absolute;
  inset:12%;
  pointer-events:none;
  background:
    radial-gradient(circle at center,color-mix(in srgb,var(--text-strong) 5%,transparent),transparent 46%),
    radial-gradient(circle at center,color-mix(in srgb,var(--accent-fill) 2.2%,transparent),transparent 70%);
  filter:blur(3px);
}
o-fluid-header{
  position:relative;
  z-index:1;
  display:block;
  width:clamp(320px,52vw,690px);
  max-width:100%;
  aspect-ratio:1;
  margin-inline:auto;
  background:transparent;
  pointer-events:none;
  touch-action:none;
  user-select:none;
  contain:layout paint size;
}
html[data-appearance="light"] .o-home-header::before{
  background:
    radial-gradient(circle at 50% 48%,rgba(20,22,28,.055),transparent 32%),
    radial-gradient(circle at 50% 50%,rgba(0,0,0,.028),transparent 60%);
}
@media(max-width:680px){
  .o-home-header{min-height:clamp(360px,62vh,560px);padding-top:.75rem}
  o-fluid-header{width:min(92vw,500px)}
}
@media(max-height:620px) and (orientation:landscape){
  .o-home-header{min-height:360px;padding-block:.5rem 1.5rem}
  o-fluid-header{width:min(58vh,480px)}
}
@media(prefers-reduced-motion:reduce){
  .o-home-header::before,.o-header-visual::before{filter:none}
}
@media print{
  .o-home-header{min-height:0;padding:1rem 0}
  o-fluid-header{display:none}
}