@layer pages{
  :root{
    --page-image-sm:url("/assets/site/pages/home-hero-1280.webp");
    --page-image-md:url("/assets/site/pages/home-hero-1920.webp");
    --page-image-lg:url("/assets/site/pages/home-hero.webp");
    --hero-image:var(--page-image);
    --band-image:url("/assets/site/pages/home-band.webp");
    --hero-light-mask:url("/assets/site/masks/home-hero-light.webp");
    --hero-water-mask:url("/assets/site/masks/home-hero-water.webp");
    --branch-above-mask:url("/assets/site/masks/home-branch-above.webp");
    --hero-logo-height:clamp(150px,min(21.3vw,var(--view-height) * .3),323px);
    --hero-text-lift:60px;
    --tagline-size:clamp(13px,1.15vw,22px);
    --sun-x:67%; --sun-y:24%;
    --ray-x:var(--sun-x); --ray-y:22%;
    --ray:rgba(255,228,170,.72);
    --ray-soft:rgba(255,214,150,.48);
    --ray-warm:rgba(255,200,120,.6);
    --sun-glow:rgba(255,236,190,.35);
    --ray-gap:6%;
    --ray-start:18%;
    --ray-reach:70%;
    --ray-long-reach:98%;
    --ray-falloff:rgba(0,0,0,.4);
    --hero-w:1672;--hero-h:941;
    --water-x0:500; --water-y0:600; --water-x1:1340; --water-y1:800;
    --sun-glow-period:23s;
    --firefly-glow:rgba(255,214,130,.85);
    --firefly-core:rgba(255,248,220,1);
    --firefly-halo:rgba(255,200,110,.45);
    --icon-card:46px;
    --leafbox-shadow:drop-shadow(0 26px 22px rgba(0,0,0,1));
    --pillars-lift:clamp(0px,var(--view-height) * .5 - 440px,68px);
    --leafbox-rail-aspect:665 / 340;
    --leafbox-squash:.84;
    --leafbox-text-top:calc(15.6% * var(--leafbox-squash) + var(--icon-card) * .5);
    --leafbox-fill-opacity:.45;
    --leafbox-frame-brightness:.72;
    --pillar-gap:var(--space-4);
    --leafbox-air-top:12%;
    --leafbox-air-bottom:7%;
    --band-overlap:480px;
    --band-image-y:30px;
    --band-image-zoom:131%;
    --band-image-x:10%;
    --branch-mask-pad:calc(var(--branch-width) * 150 / 3192);
    --band-fade-span:380px;
    --band-divider-gap:var(--space-4);
    --band-bottom-space:calc(var(--space-6) * 1.1);
    --band-divider-width:460px;
    --modules-bottom-space:calc(var(--space-5) + var(--space-3));
    --branch-leaf-x:calc(1576 / 3192);
    --branch-width:calc(var(--view-width) * 3192 / 3152);
    --branch-rail-offset:calc(var(--branch-width) * 128 / 2128);
    --parallax-leafboxes:60px;
    --parallax-branch:60px;
  }
  .hero{position:relative;height:auto;min-height:var(--view-height);display:flex;flex-direction:column;
    justify-content:flex-end;
    padding:calc(var(--header-top) + var(--header-height)) var(--page-gutter) var(--space-2)}
  .hero-bg,.hero-shade,.hero .art-frame,.hero .light-frame{position:absolute;inset:auto;top:0;left:var(--page-image-left);
    width:var(--page-image-width);height:var(--page-image-height);pointer-events:none}
  .hero-bg{overflow:clip;
    mask:url("/assets/site/masks/home-hero.svg") bottom/100% var(--ground-edge-height) no-repeat,
      linear-gradient(black,black) top/100% calc(100% - var(--ground-edge-height)) no-repeat}
  .hero-bg::before{content:"";position:absolute;inset:0;
    background:var(--hero-image) center/cover no-repeat}
  .hero-shade{
    mask:url("/assets/site/masks/home-hero.svg") bottom/100% var(--ground-edge-height) no-repeat,
      linear-gradient(black,black) top/100% calc(100% - var(--ground-edge-height)) no-repeat;
    background:
      linear-gradient(var(--vignette),var(--vignette-mid) 14%,transparent 34%),
      linear-gradient(transparent 62%,color-mix(in srgb,var(--ground) 14%,transparent) 78%,
        color-mix(in srgb,var(--ground) 30%,transparent) 92%,color-mix(in srgb,var(--ground) 38%,transparent)),
      radial-gradient(ellipse 30% 36% at 50% 46%,var(--veil-mid),transparent),
      linear-gradient(transparent 50%,var(--veil-mid) 72%,transparent)}
  .hero .art-frame{--art-w:1672;--art-h:941;
    --art-image:var(--hero-image);--water-mask:var(--hero-water-mask)}
  .water{position:absolute;overflow:hidden;
    left:calc(var(--water-x0) / var(--art-w) * 100%);top:calc(var(--water-y0) / var(--art-h) * 100%);
    width:calc((var(--water-x1) - var(--water-x0)) / var(--art-w) * 100%);
    height:calc((var(--water-y1) - var(--water-y0)) / var(--art-h) * 100%);
    mask:var(--water-mask) 0 0/100% 100% no-repeat;filter:url(#water-ripple)}
  .water::before{content:"";position:absolute;
    width:calc(var(--art-w) / (var(--water-x1) - var(--water-x0)) * 100%);
    height:calc(var(--art-h) / (var(--water-y1) - var(--water-y0)) * 100%);
    left:calc(var(--water-x0) / (var(--water-x1) - var(--water-x0)) * -100%);
    top:calc(var(--water-y0) / (var(--water-y1) - var(--water-y0)) * -100%);
    background:var(--art-image) 0 0/100% 100% no-repeat}
  .art-frame.is-offscreen .water{filter:none}
  @media (pointer:coarse){.water{display:none}}
  .hero-text{position:relative;z-index:2;margin:auto;translate:0 calc(var(--hero-text-lift) * -1);text-align:center;text-shadow:var(--text-shadow)}
  .pillars{position:relative;z-index:2;translate:0 calc(var(--pillars-lift) * -1)}
  .hero .light-frame{--light-w:var(--hero-w);--light-h:var(--hero-h)}
  .rays{
    mask:
      var(--hero-light-mask) 0 0/100% 100% no-repeat luminance,
      radial-gradient(ellipse 75% 110% at var(--ray-x) var(--ray-y),
        transparent var(--ray-gap),black var(--ray-start),var(--ray-falloff) 38%,transparent var(--ray-reach)),
      linear-gradient(transparent 3%,black 16%,black 78%,transparent 92%);
    mask-composite:intersect}
  .rays i:nth-child(1) {--angle:100deg;  --width:12deg;--color:var(--ray-soft);--strength:.8; --duration:11s;--delay:-3s; --drift:2.6deg}
  .rays i:nth-child(2) {--angle:113.5deg;--width:44deg;--color:var(--ray);     --strength:.55;--duration:14s;--delay:-10s;--drift:-2.2deg}
  .rays i:nth-child(3) {--angle:127deg;  --width:16deg;--color:var(--ray-warm);--strength:1;  --duration:9s; --delay:-6s; --drift:2deg}
  .rays i:nth-child(4) {--angle:140.5deg;--width:30deg;--color:var(--ray);     --strength:.75;--duration:13s;--delay:-1s; --drift:3deg}
  .rays i:nth-child(5) {--angle:154deg;  --width:10deg;--color:var(--ray-soft);--strength:1;  --duration:10s;--delay:-12s;--drift:-2.4deg}
  .rays i:nth-child(6) {--angle:167.5deg;--width:52deg;--color:var(--ray-warm);--strength:.5; --duration:15s;--delay:-8s; --drift:2.2deg}
  .rays i:nth-child(7) {--angle:181deg;  --width:20deg;--color:var(--ray);     --strength:1;  --duration:8s; --delay:-4s; --drift:-2.8deg}
  .rays i:nth-child(8) {--angle:194.5deg;--width:38deg;--color:var(--ray-soft);--strength:.7; --duration:12s;--delay:-13s;--drift:2.4deg}
  .rays i:nth-child(9) {--angle:208deg;  --width:14deg;--color:var(--ray);     --strength:.95;--duration:10s;--delay:-7s; --drift:-2deg}
  .rays i:nth-child(10){--angle:221.5deg;--width:26deg;--color:var(--ray-warm);--strength:.7; --duration:16s;--delay:-2s; --drift:2.8deg}
  .rays i:nth-child(11){--angle:235deg;  --width:48deg;--color:var(--ray);     --strength:.55;--duration:11s;--delay:-9s; --drift:-2.4deg}
  .rays i:nth-child(12){--angle:248.5deg;--width:18deg;--color:var(--ray-soft);--strength:.85;--duration:13s;--delay:-5s; --drift:2.2deg}
  .rays i:nth-child(13){--angle:262deg;  --width:34deg;--color:var(--ray);     --strength:.7; --duration:12s;--delay:-11s;--drift:-2.6deg}
  .rays-long{
    mask:
      var(--hero-light-mask) 0 0/100% 100% no-repeat luminance,
      radial-gradient(ellipse 120% 150% at var(--ray-x) var(--ray-y),
        transparent var(--ray-gap),black var(--ray-start),rgba(0,0,0,.75) 45%,transparent var(--ray-long-reach)),
      linear-gradient(transparent 3%,black 16%,black 80%,transparent 94%);
    mask-composite:intersect}
  .rays-long i:nth-child(1){--angle:238deg;--width:24deg;--color:var(--ray-warm);--strength:.85;--duration:22s;--delay:-4s; --drift:6deg}
  .rays-long i:nth-child(2){--angle:249deg;--width:40deg;--color:var(--ray);     --strength:.6; --duration:28s;--delay:-17s;--drift:-7deg}
  .rays-long i:nth-child(3){--angle:258deg;--width:14deg;--color:var(--ray);     --strength:1;  --duration:19s;--delay:-9s; --drift:6deg}
  .rays-long i:nth-child(4){--angle:267deg;--width:32deg;--color:var(--ray-soft);--strength:.85;--duration:25s;--delay:-21s;--drift:-7deg}
  .rays-long i:nth-child(5){--angle:277deg;--width:18deg;--color:var(--ray-warm);--strength:.9; --duration:21s;--delay:-13s;--drift:5deg}
  .rays-long i:nth-child(6){--angle:228deg;--width:16deg;--color:var(--ray);     --strength:.8; --duration:24s;--delay:-7s; --drift:-6deg}
  .hero h1{margin:0}
  .hero h1 img{height:var(--hero-logo-height);width:auto;margin:0 auto;
    filter:drop-shadow(var(--text-shadow)) var(--title-halo)}
  .hero .tagline{font:500 var(--tagline-size) Cinzel;letter-spacing:.3em;text-transform:uppercase;margin:var(--space-2) 0 var(--space-4);
    text-shadow:var(--tagline-shadow),var(--text-halo)}
  .hero-actions{display:flex;gap:var(--space-3);justify-content:center}
  .pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--pillar-gap)}
  .leafbox{--leafbox-frame:url("/assets/site/decor/leafboxes/frame-1.webp");
    --leafbox-fill:url("/assets/site/decor/leafboxes/fill-1.webp");
    --lb-img-left:-3.89%;--lb-img-top:-21.07%;--lb-img-w:108.22%;--lb-img-h:132.34%;
    --leafbox-icon-x:51.1%;--leafbox-icon-y:5.9%}
  .leafbox{position:relative;isolation:isolate;min-width:0;filter:var(--leafbox-shadow);aspect-ratio:var(--leafbox-rail-aspect);
    display:grid;justify-items:center;align-content:start;gap:2px;text-align:center;
    padding:var(--leafbox-text-top) 13% 7%}
  .leafbox::before,.leafbox::after{content:"";position:absolute;z-index:-1;pointer-events:none;
    left:var(--lb-img-left);top:var(--lb-img-top);width:var(--lb-img-w);height:var(--lb-img-h)}
  .leafbox::before{background:
      linear-gradient(transparent 15%,color-mix(in srgb,var(--card-solid) 55%,transparent) 55%,color-mix(in srgb,var(--card-solid) 92%,transparent) 100%),
      url("/assets/site/decor/leafbox-ground.svg") center/cover no-repeat,var(--ground);
    opacity:var(--leafbox-fill-opacity);mask:var(--leafbox-fill) 0 0/100% 100% no-repeat}
  .leafbox::after{background:var(--leafbox-frame) 0 0/100% 100% no-repeat;filter:brightness(var(--leafbox-frame-brightness)) drop-shadow(0 4px 10px rgba(0,0,0,.55))}
  .pillars img{position:absolute;left:var(--leafbox-icon-x);top:calc(var(--leafbox-icon-y) + var(--icon-nudge-y,0px));translate:-50% -50%;
    width:calc(var(--icon-card) * var(--icon-scale,1));height:calc(var(--icon-card) * var(--icon-scale,1))}
  .pillars h3{font:600 18px Cinzel;letter-spacing:.04em;margin:0;color:transparent;background:var(--title-metal);-webkit-background-clip:text;background-clip:text;filter:var(--metal-quiet)}
  .pillars p{margin:0;font-size:15px;color:var(--text-muted);text-wrap:pretty}
  .modules{position:relative;z-index:1;isolation:isolate;display:grid;margin-top:calc(var(--pillars-lift) * -.5);
    grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:var(--space-4);
    padding:var(--space-5) var(--page-gutter) var(--modules-bottom-space)}
  .read-more{display:inline-block;margin-top:var(--space-1);font:500 14px Jost;color:var(--gold);
    transition:color var(--button-ease)}
  .read-more::after{content:" \203A";color:var(--gold-light)}
  .read-more:hover,.read-more:focus-visible{color:var(--gold-light)}
  .read-more[hidden]{display:none}
  .roster{list-style:none;margin:var(--space-3) 0 0;padding:0;flex:1;display:grid;
    grid-template-columns:repeat(auto-fit,minmax(calc(var(--avatar-size) + var(--space-2)),1fr));
    gap:var(--space-3) var(--space-2);align-content:center}
  .roster li{display:grid;justify-items:center;gap:var(--space-1);font-size:15px}
  .roster-quote{text-align:center;font-style:italic;color:var(--text-muted)}
  .openings.is-teaser{flex:1 1 0;min-height:calc(var(--opening-role-row) * 1.5)}
  .band{position:relative;overflow:clip;margin-top:calc(var(--band-overlap) * -1);
    display:flex;flex-direction:column;align-items:center;
    padding:calc(var(--band-overlap) - var(--branch-rail-offset)) var(--page-gutter) var(--band-bottom-space)}
  .band::before{content:"";position:absolute;inset:0;z-index:0;
    --branch-top:calc(var(--band-overlap) - var(--branch-rail-offset) - var(--branch-mask-pad));
    mask-image:linear-gradient(transparent calc(var(--branch-top) + var(--branch-mask-pad)),
        black calc(var(--branch-top) + var(--branch-mask-pad))),
      var(--branch-above-mask);
    mask-position:0 0,calc(50% + var(--branch-width) * (0.5 - var(--branch-leaf-x))) var(--branch-top);
    mask-size:100% 100%,var(--branch-width) auto;
    mask-repeat:no-repeat,no-repeat;
    mask-composite:subtract,add;
    background:
      var(--band-image) var(--band-image-x) var(--band-image-y)/var(--band-image-zoom) auto no-repeat var(--ground)}
  .band-content{position:relative;z-index:2;isolation:isolate;display:grid;justify-items:center;text-align:center;gap:var(--space-3);
    text-shadow:var(--text-shadow-soft)}
  .band-divider-top{position:relative;z-index:0;align-self:flex-start;width:var(--branch-width);max-width:none;height:auto;
    margin:0 0 var(--band-divider-gap) calc(50% - var(--branch-width) * var(--branch-leaf-x));
    pointer-events:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.6))}
  .band .keywords{font:500 14px Jost;letter-spacing:.3em;text-transform:uppercase;color:var(--text-muted);margin:0}
  .band blockquote{font:500 clamp(22px,2.6vw,40px)/1.35 Cinzel;color:var(--heading);max-width:26ch;margin:0}
  .band-divider{width:var(--band-divider-width);height:auto;margin-bottom:var(--space-1)}
  .band blockquote+.button{margin-top:var(--space-3)}
  .pillars,.band{--parallax-subject:1}
  .pillars{--travel:var(--parallax-leafboxes)}
  .band-divider-top{--travel:var(--parallax-branch)}
  @supports (animation-timeline: view()){
    .pillars{animation:parallax-fore linear both;animation-timeline:view()}
    .band{timeline-scope:--branch}
    .band-divider-top{view-timeline:--branch block}
    .band-divider-top{animation:parallax-fore linear both;animation-timeline:--branch}
  }
  @supports not (animation-timeline: view()){
    .pillars,.band-divider-top{transform:translateY(calc((.5 - var(--view-p,.5)) * var(--travel)))}
  }
  @media (prefers-reduced-motion:reduce),(pointer:coarse){
    .pillars,.band-divider-top{animation:none;transform:none}
  }
  @media (max-width:1700px){
    .pillars{grid-template-columns:repeat(2,1fr);max-width:1000px;margin-inline:auto;row-gap:0}
    .pillars .leafbox{margin-block:var(--leafbox-air-top) var(--leafbox-air-bottom)}
    :root{--pillars-lift:0px}
  }
  @media (max-width:900px){
    :root{--hero-text-lift:0px;
      --band-overlap:300px;--band-divider-width:min(460px,72%);
      --modules-bottom-space:var(--space-5);--band-bottom-space:var(--space-5)}
    .band::before{background-size:cover;background-position:var(--band-image-x) top}
    .hero{height:auto;min-height:0;padding-bottom:var(--space-4)}
    .fireflies{inset:0 0 auto;height:var(--view-height)}
    .hero-text{display:grid;justify-items:center;align-content:center;
      min-height:calc(var(--view-height) - var(--header-height) - var(--space-4) * 2)}
    .pillars{grid-template-columns:1fr;max-width:460px;margin:var(--space-5) auto 0;gap:0}
  }
  @media (max-width:620px){
    :root{--icon-card:36px}
    .hero-actions{flex-direction:column;align-items:center;width:100%}
    .hero-actions .button{width:100%;max-width:320px;min-width:0}
    .pillars p{font-size:14px}
    .band .keywords{font-size:11px;letter-spacing:.14em}
    .hero .tagline{text-wrap:balance}
  }
  .pillars .leafbox:nth-child(1){--reveal-delay:.85s}
  .pillars .leafbox:nth-child(2){--reveal-delay:.97s}
  .pillars .leafbox:nth-child(3){--reveal-delay:1.09s}
  .pillars .leafbox:nth-child(4){--reveal-delay:1.21s}
}