.hero-tinting-banner{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background-color:#000}.hero-tinting-banner__video,.hero-tinting-banner__image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:1}.hero-tinting-banner__image{background-size:cover;background-position:center;background-repeat:no-repeat}.hero-tinting-banner__overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;pointer-events:none}.hero-tinting-banner__content-wrapper{position:relative;z-index:3;width:100%;padding:60px 0}.hero-tinting-banner__content{max-width:1200px;margin:0 auto;padding:0 40px;text-align:center;color:#fff}.hero-tinting-banner__eyebrow{display:inline-block;padding:8px 20px;background-color:#00d9ff26;border:1px solid rgba(0,217,255,.4);border-radius:20px;color:#00d9ff;font-size:14px;font-weight:500;letter-spacing:.5px;margin-bottom:24px;text-transform:none}.hero-tinting-banner__title{font-size:64px;font-weight:700;line-height:1.1;margin:0 0 24px;letter-spacing:-1px;color:#fff}.hero-tinting-banner__title-highlight{display:block;color:#00d9ff;background:linear-gradient(90deg,#00d9ff,#00a8cc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-tinting-banner__description{font-size:18px;line-height:1.6;max-width:700px;margin:0 auto 40px;color:#ffffffe6}.hero-tinting-banner__buttons{display:flex;gap:16px;justify-content:center;align-items:center;margin-bottom:60px;flex-wrap:wrap}.hero-tinting-banner__button{display:inline-flex;align-items:center;gap:8px;padding:16px 32px;font-size:16px;font-weight:600;text-decoration:none;border-radius:8px;transition:all .3s ease;cursor:pointer;border:2px solid transparent}.hero-tinting-banner__button--primary{background-color:#00d9ff;color:#000;border-color:#00d9ff}.hero-tinting-banner__button--primary:hover{background-color:#00a8cc;border-color:#00a8cc;transform:translateY(-2px);box-shadow:0 8px 20px #00d9ff4d}.hero-tinting-banner__button--primary svg{transition:transform .3s ease}.hero-tinting-banner__button--primary:hover svg{transform:translate(4px)}.hero-tinting-banner__button--secondary{background-color:transparent;color:#fff;border-color:#ffffff4d}.hero-tinting-banner__button--secondary:hover{background-color:#ffffff1a;border-color:#ffffff80;transform:translateY(-2px)}.hero-tinting-banner__features{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;max-width:1000px;margin:0 auto}.hero-tinting-banner__feature{display:flex;flex-direction:column;align-items:center;padding:32px 24px;background:#0006;border:1px solid rgba(255,255,255,.1);border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.hero-tinting-banner__feature:hover{background:#00000080;border-color:#00d9ff4d;transform:translateY(-4px)}.hero-tinting-banner__feature-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;color:#00d9ff}.hero-tinting-banner__feature-icon svg{width:100%;height:100%}.hero-tinting-banner__feature-content{text-align:center}.hero-tinting-banner__feature-title{font-size:18px;font-weight:600;margin:0 0 8px;color:#fff}.hero-tinting-banner__feature-description{font-size:14px;margin:0;color:#ffffffb3}html{scroll-behavior:smooth}@media (max-width: 1024px){.hero-tinting-banner__content{padding:0 30px}.hero-tinting-banner__title{font-size:48px}.hero-tinting-banner__description{font-size:16px}.hero-tinting-banner__features{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}@media (max-width: 768px){.hero-tinting-banner{min-height:auto;padding:80px 0}.hero-tinting-banner__content-wrapper{padding:40px 0}.hero-tinting-banner__content{padding:0 20px}.hero-tinting-banner__title{font-size:36px}.hero-tinting-banner__description{font-size:15px;margin-bottom:32px}.hero-tinting-banner__buttons{flex-direction:column;width:100%;margin-bottom:40px}.hero-tinting-banner__button{width:100%;max-width:320px;justify-content:center}.hero-tinting-banner__features{grid-template-columns:1fr;gap:16px}.hero-tinting-banner__feature{padding:24px 20px}}@media (max-width: 480px){.hero-tinting-banner__title{font-size:28px}.hero-tinting-banner__eyebrow{font-size:12px;padding:6px 16px}.hero-tinting-banner__button{padding:14px 24px;font-size:15px}}
/*# sourceMappingURL=/cdn/shop/t/194/assets/section-hero-tinting-banner.css.map */