/* Home hero: headline beside the animated logo. */
/* The cover's inner container is its own stacking layer (z-index:1); flatten it so the
   video's screen blend sees the banner photo, and let the cover grow with its content. */
.home .wp-block-cover.alignfull{height:auto;}
/* Salient's responsive css forces img{height:auto} on phones, which shrinks the banner image. */
.home .wp-block-cover .wp-block-cover__image-background{height:100%!important;width:100%!important;}
.sl3d-hero{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(12px,2vw,24px);width:100%;max-width:1000px;margin:0 auto;padding:0 20px;box-sizing:border-box;}
.sl3d-hero-text{flex:0 0 auto;width:100%;min-width:0;}
.sl3d-hero-video{order:-1;flex:0 0 auto;width:clamp(120px,14vw,200px);}
.sl3d-hero-logo{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:transparent;pointer-events:none;filter:drop-shadow(0 10px 24px rgba(0,0,0,.5));}
@media (max-width:820px){
  .sl3d-hero{gap:6px;padding:0 12px;}
  .sl3d-hero-text .nfd-text-sm{white-space:normal;overflow-wrap:anywhere;letter-spacing:.08em;}
  .sl3d-hero-video{width:min(32vw,130px);}
  .sl3d-hero-text .wp-block-spacer{display:none;}
}
@media (prefers-reduced-motion:reduce){.sl3d-hero-video{display:none;}}

/* Hero type. The page's nfd-* classes come from the Bluehost plugin, which is not on the new host,
   so the hero carries its own sizes. */
.sl3d-hero-text{text-align:center;color:#fff;}
.sl3d-hero-text .nfd-text-sm{font-size:clamp(11px,1.2vw,14px)!important;letter-spacing:.14em;color:#fff!important;opacity:.85;margin:0 0 12px;}
.sl3d-hero-text h1{font-size:clamp(30px,5.2vw,68px)!important;line-height:1.08!important;font-weight:400;color:#fff;margin:0;overflow-wrap:anywhere;text-shadow:0 2px 18px rgba(0,0,0,.45);}
.sl3d-hero-text .wp-block-buttons{margin-top:clamp(20px,3vw,50px)!important;gap:clamp(16px,3vw,40px);}
.sl3d-hero-text .wp-block-button__link{font-size:clamp(14px,1.2vw,17px);}
.sl3d-hero-text > p:not([class]),.sl3d-hero-text .wp-block-buttons > p,.sl3d-hero-text br{display:none;}
@media (max-width:820px){
  .sl3d-hero-text .wp-block-buttons{margin-top:18px!important;}
}

/* The hero's alignfull blocks use the 100vw trick; on phones the overflow it creates widens the layout
   viewport and shifts the whole page. Contain it. */
body.home{overflow-x:hidden;}
.home .container-wrap,.home #ajax-content-wrap{overflow-x:clip;}

/* Hero v2: Neal's collage banner. The collage is the middle third of a 16:9 image; each black side third
   carries a looping video. The headline sits over the collage on a soft dark panel. Sides only exist on
   wide screens; phones get the collage center with the small logo above the headline. */
.home .wp-block-cover:has(.sl3d-hero-v2){aspect-ratio:16/9!important;min-height:0!important;height:auto!important;padding:0!important;}
.home .wp-block-cover:has(.sl3d-hero-v2) .wp-block-cover__image-background{object-position:center center;}
.sl3d-hero-v2{position:static;max-width:none;padding:0;}
/* The side panels must size against the whole banner, not the inner text container. */
.home .wp-block-cover:has(.sl3d-hero-v2) .wp-block-cover__inner-container{position:static!important;}
.sl3d-hero-v2 .sl3d-hero-text{position:relative;z-index:2;width:min(30%,560px);padding:clamp(12px,1.6vw,24px) clamp(12px,1.6vw,22px);
  background:rgba(10,8,16,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border-radius:14px;border:1px solid rgba(255,255,255,.08);}
.sl3d-hero-v2 .sl3d-hero-video{display:none;}                /* the centered logo moves to the right panel */
.sl3d-hero-side{position:absolute;top:0;bottom:0;width:33.33%;display:flex;align-items:center;justify-content:center;pointer-events:none;}
.sl3d-hero-side-left{left:0;}
.sl3d-hero-side-right{right:0;}
.sl3d-hero-side video{display:block;height:84%;width:auto;max-width:92%;aspect-ratio:9/16;object-fit:contain;}
.sl3d-hero-side-left video{border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.6);}
.sl3d-hero-side-right .sl3d-hero-logo{filter:drop-shadow(0 10px 24px rgba(0,0,0,.6));}
.sl3d-hero-v2 .sl3d-hero-text h1{font-size:clamp(20px,2.4vw,38px)!important;text-shadow:0 2px 10px rgba(0,0,0,.85);}
.sl3d-hero-v2 .sl3d-hero-text .nfd-text-sm{text-shadow:0 1px 6px rgba(0,0,0,.9);margin-bottom:8px;}
.sl3d-hero-v2 .sl3d-hero-text .wp-block-buttons{margin-top:clamp(10px,1.4vw,20px)!important;gap:clamp(10px,1.6vw,24px);}
.sl3d-hero-v2 .sl3d-hero-text .wp-block-button__link{font-size:clamp(13px,1vw,15px);padding:12px 26px!important;}
@media (max-width:1000px){
  .home .wp-block-cover:has(.sl3d-hero-v2){aspect-ratio:4/5!important;}
  .sl3d-hero-side{display:none;}
  .sl3d-hero-v2 .sl3d-hero-video{display:block;width:min(30vw,130px);margin:0 auto 8px;}
  .sl3d-hero-v2 .sl3d-hero-text{width:min(92%,520px);padding:14px 14px 18px;}
}

/* Hero v3: Neal's simple banner. Wordmark across the top, insert stack on the left third, black elsewhere.
   Headline + buttons centered under the wordmark; logo loop on the right third, sized like the stack.
   Phones: no background image, just logo, headline and buttons on black. */
.home .wp-block-cover:has(.sl3d-hero-v3){background:#000;}
.sl3d-hero-v3{align-items:center;justify-content:flex-start;padding:0;}
/* Headline block: centered in the band below the wordmark (wordmark ends ~30% down), clear of the stack (ends ~34% across). */
.sl3d-hero-v3 .sl3d-hero-text{position:absolute;left:52%;top:62%;transform:translate(-50%,-50%);width:min(27%,520px);
  background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;padding:0;}
.sl3d-hero-v3 .sl3d-hero-text h1{font-size:clamp(22px,2.6vw,44px)!important;}
.sl3d-hero-v3 .sl3d-hero-side-right{top:27%;bottom:21%;width:36%;}
.sl3d-hero-v3 .sl3d-hero-side-right .sl3d-hero-logo{height:100%;}
@media (max-width:1000px){
  .home .wp-block-cover:has(.sl3d-hero-v3){aspect-ratio:auto!important;min-height:0!important;}
  .home .wp-block-cover:has(.sl3d-hero-v3) .wp-block-cover__image-background{display:none;}
  .sl3d-hero-v3{padding:28px 12px 30px;}
  .sl3d-hero-v3 .sl3d-hero-text{position:static;transform:none;width:min(92%,520px);}
  .sl3d-hero-v3 .sl3d-hero-video{width:min(34vw,150px);margin:0 auto 10px;}
}