/* BGW Hero — high-end, variable-driven. All sizing/typography comes from inline --vars set per hero. */
.bgwh{position:relative;display:flex;overflow:hidden;color:var(--text,#f4efe6)}
.bgwh-overlay{position:absolute;inset:0;z-index:0}

/* ambient layers */
@keyframes bgwhdrift{to{transform:translate(8vw,10vh) scale(1.15)}}
.bgwh.glow::before{content:"";position:absolute;width:120vw;height:120vh;left:-10vw;top:-30vh;background:radial-gradient(40% 40% at 30% 30%,var(--glow,var(--glow,rgba(201,137,63,.16))),transparent 70%);animation:bgwhdrift 16s ease-in-out infinite alternate;pointer-events:none;z-index:0}
.bgwh.vignette::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 10%,transparent 40%,var(--bgwh-vig,rgba(0,0,0,.55)));pointer-events:none;z-index:0}
/* the dark vignette suits a dark hero; on the light palette it reads as an ugly gray smudge, so turn it off in light mode */
[data-theme="light"] .bgwh{--bgwh-vig:transparent}

.bgwh-inner{position:relative;z-index:1;width:100%;max-width:var(--cmaxw,1180px);margin:0 auto;display:grid;grid-template-columns:var(--split,1fr 1fr);gap:var(--gap,5vw);align-items:center}
.bgwh.solo .bgwh-inner{grid-template-columns:1fr}
.bgwh.imgleft .bgwh-text{order:2}
.bgwh.imgleft .bgwh-media{order:1}

/* text — every property is a variable */
.bgwh-eyebrow{font-family:var(--eb-font);font-size:var(--eb-size);font-weight:var(--eb-weight);line-height:var(--eb-lh);letter-spacing:var(--eb-ls);color:var(--eb-color);text-transform:var(--eb-tr);margin-top:var(--eb-mt)}
.bgwh-title{font-family:var(--h-font);font-size:var(--h-size);font-weight:var(--h-weight);line-height:var(--h-lh);letter-spacing:var(--h-ls);color:var(--h-color);margin:var(--h-mt) 0 0}
.bgwh-sub{font-family:var(--sh-font);font-size:var(--sh-size);font-weight:var(--sh-weight);line-height:var(--sh-lh);letter-spacing:var(--sh-ls);color:var(--sh-color);font-style:var(--sh-style);margin-top:var(--sh-mt)}
.bgwh-lead{font-family:var(--ld-font);font-size:var(--ld-size);font-weight:var(--ld-weight);line-height:var(--ld-lh);letter-spacing:var(--ld-ls);color:var(--ld-color);margin:var(--ld-mt) 0 0;max-width:var(--ld-maxw)}
.bgwh-body{font-family:var(--bd-font);font-size:var(--bd-size);font-weight:var(--bd-weight);line-height:var(--bd-lh);letter-spacing:var(--bd-ls);color:var(--bd-color);margin:var(--bd-mt) 0 0;max-width:var(--bd-maxw)}

/* alignment */
.bgwh.tcenter .bgwh-text{text-align:center}
.bgwh.tcenter .bgwh-lead,.bgwh.tcenter .bgwh-body{margin-left:auto;margin-right:auto}
.bgwh.tcenter .bgwh-btns{justify-content:center}

/* buttons */
.bgwh-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:var(--btns-mt,34px)}
.bgwh-btn{display:inline-flex;align-items:center;gap:.5em;font-family:'Inter',-apple-system,sans-serif;font-weight:600;line-height:1;border-radius:var(--btn-radius,6px);cursor:pointer;border:1px solid transparent;text-decoration:none;transition:transform .2s,background .2s,color .2s,border-color .2s}
.bgwh-size-sm .bgwh-btn{font-size:13px;padding:11px 20px}
.bgwh-size-md .bgwh-btn{font-size:15px;padding:15px 28px}
.bgwh-size-lg .bgwh-btn{font-size:17px;padding:18px 34px}
.bgwh-btn-primary{background:var(--accent,#9b2f2c);color:var(--on-accent,#121011)}
.bgwh-btn-primary:hover{background:var(--accent2,#b24a47);transform:translateY(-2px)}
.bgwh-btn-ghost{background:none;border-color:var(--line2,rgba(244,239,230,.3));color:var(--text,#f4efe6)}
.bgwh-btn-ghost:hover{border-color:var(--accent,#9b2f2c);color:var(--accent,#9b2f2c)}
.bgwh-btn-text{background:none;color:var(--accent,#9b2f2c);padding-left:0;padding-right:0}
.bgwh-btn-text:hover{color:var(--accent2,#b24a47)}

/* image */
.bgwh-media{position:relative}
.bgwh-media img{display:block;width:100%;height:100%;max-height:var(--img-maxh,78vh);object-fit:var(--img-fit,cover);border-radius:var(--img-round,12px);border:var(--img-border,0)}
.bgwh-media img.shadow{box-shadow:0 30px 80px rgba(0,0,0,.55)}

/* image entrance animation (revealed by .in via JS) */
.bgwh-media img[data-anim]{opacity:0;transition:opacity var(--img-dur,800ms) ease,transform var(--img-dur,800ms) cubic-bezier(.2,.7,.2,1);transition-delay:var(--img-delay,150ms);will-change:opacity,transform}
.bgwh-media img[data-anim="left"]{transform:translateX(-48px)}
.bgwh-media img[data-anim="right"]{transform:translateX(48px)}
.bgwh-media img[data-anim="up"]{transform:translateY(48px)}
.bgwh-media img[data-anim="down"]{transform:translateY(-48px)}
.bgwh-media img[data-anim="zoom"]{transform:scale(.9)}
.bgwh.in .bgwh-media img[data-anim]{opacity:1;transform:none}

/* text entrance animation (stagger) */
.bgwh.tanim .bgwh-text>*{opacity:0;transform:translateY(22px);transition:opacity var(--txt-dur,700ms) ease,transform var(--txt-dur,700ms) cubic-bezier(.2,.7,.2,1)}
.bgwh.tanim.in .bgwh-text>*{opacity:1;transform:none}
.bgwh.tanim.in .bgwh-text>*:nth-child(1){transition-delay:.05s}
.bgwh.tanim.in .bgwh-text>*:nth-child(2){transition-delay:.13s}
.bgwh.tanim.in .bgwh-text>*:nth-child(3){transition-delay:.21s}
.bgwh.tanim.in .bgwh-text>*:nth-child(4){transition-delay:.29s}
.bgwh.tanim.in .bgwh-text>*:nth-child(5){transition-delay:.37s}
.bgwh.tanim.in .bgwh-text>*:nth-child(6){transition-delay:.45s}

@media(max-width:820px){
	.bgwh-inner{grid-template-columns:1fr;gap:34px}
	.bgwh.imgleft .bgwh-text,.bgwh.imgleft .bgwh-media{order:0}
	.bgwh-text{text-align:center}
	.bgwh-lead,.bgwh-body{margin-left:auto;margin-right:auto}
	.bgwh-btns{justify-content:center}
	.bgwh-media img{max-height:58vh}
}
@media(prefers-reduced-motion:reduce){
	.bgwh.glow::before{animation:none}
	.bgwh-media img[data-anim],.bgwh.tanim .bgwh-text>*{opacity:1;transform:none;transition:none}
}
