.tp-hero-banner{position:relative;width:100vw;margin-left:calc(-50vw + 50%);min-height:var(--tp-hb-h-mobile, 350px);overflow:hidden;display:flex;align-items:center;justify-content:center;font-family:var(--ff);color:var(--color-text);background:radial-gradient(120% 130% at 82% 50%,var(--accent-glow) 0%,transparent 55%),linear-gradient(180deg,var(--surface) 0%,var(--color-page) 100%)}.tp-hero-banner__bg{z-index:0}.tp-hero-banner__overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgb(var(--color-page-rgb) / .45),rgb(var(--color-page-rgb) / .65))}[data-tptheme=light] .tp-hero-banner{color:var(--hero-fg);background:var(--hero-cone),var(--hero-bg)}[data-tptheme=light] .tp-hero-banner__overlay{background:linear-gradient(180deg,#14315c8c,#122f5ec7)}[data-tptheme=light] .tp-hero-banner__title{color:var(--hero-fg)}[data-tptheme=light] .tp-hero-banner__subtitle{color:var(--hero-fg-muted)}[data-tptheme=light] .tp-hero-banner__button{background:var(--tp-green);color:#04140a}[data-tptheme=light] .tp-hero-banner__button:hover{background:transparent;color:var(--hero-fg);border-color:var(--hero-fg)}.tp-hero-banner__content{position:relative;z-index:2;text-align:center;padding:var(--sp-16) var(--sp-5);max-width:800px;width:100%}.tp-hero-banner__content--left{text-align:left;margin-right:auto;margin-left:5%}.tp-hero-banner__content--right{text-align:right;margin-left:auto;margin-right:5%}.tp-hero-banner__title{font-size:clamp(var(--fs-3xl),4.8vw,var(--fs-4xl));font-weight:var(--fw-extra);color:var(--color-text);margin:0 0 var(--sp-4);letter-spacing:-.02em;line-height:1.15}.tp-hero-banner__subtitle{font-size:var(--fs-lg);color:var(--color-muted);margin:0 0 var(--sp-6);line-height:1.6}.tp-hero-banner__button{display:inline-block;background:var(--cta-bg);color:var(--cta-fg);padding:14px 36px;border-radius:var(--r-sm);font-weight:var(--fw-semi);font-size:var(--fs-base);text-decoration:none;transition:all var(--dur) var(--ease);border:2px solid transparent}.tp-hero-banner__button:hover{transform:translateY(-2px);box-shadow:0 16px 40px -12px var(--cta-glow)}@media(min-width:768px){.tp-hero-banner{min-height:var(--tp-hb-h-desktop, 500px)}.tp-hero-banner__content{padding:var(--sp-20) var(--sp-10)}}
/*# sourceMappingURL=/cdn/shop/t/26/assets/tp-hero-banner.css.map */
