@import "https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@100..900&display=swap";
.services-section{background:#111;padding:100px;position:relative;overflow:hidden}.services-top{text-align:center;max-width:900px;margin:auto}.services-tag{color:#9e140b;text-transform:uppercase;letter-spacing:.4em;margin-bottom:20px;font-family:Inter,sans-serif;font-size:13px}.services-heading{color:#fff;letter-spacing:4px;text-transform:uppercase;margin-top:20px;font-family:Bebas Neue,sans-serif;font-size:clamp(48px,5vw,82px);font-weight:600;line-height:.95}.services-description{color:#ffffffa6;max-width:650px;margin:35px auto 0;font-family:Inter,sans-serif;font-size:18px;line-height:1.9}.services-grid{grid-template-columns:.9fr 1.1fr;align-items:center;gap:30px;margin-top:100px;display:grid}.services-right{flex-direction:column;gap:24px;display:flex}.service-item{cursor:pointer;will-change:transform;background:#ffffff08;border:1px solid #ffffff14;border-radius:32px;height:100px;transition:all .5s;position:relative;overflow:hidden;transform:translateZ(0)}.service-item:before{content:"";opacity:0;z-index:1;background:linear-gradient(120deg,#0000,#9e140b26,#0000);transition:all .5s;position:absolute;inset:0}.service-item:hover:before{opacity:1}.service-video{object-fit:cover;object-position:center;opacity:.16;will-change:transform;width:100%;height:100%;transition:all .8s;position:absolute;inset:0;transform:translateZ(0)}.service-overlay{background:linear-gradient(90deg,#000000f0,#00000073);position:absolute;inset:0}.service-content{z-index:2;justify-content:space-between;align-items:center;height:100%;padding:0 38px;display:flex;position:relative}.service-left{align-items:center;gap:28px;display:flex}.service-left span{color:#9e140b;letter-spacing:.3em;font-family:Inter,sans-serif;font-size:13px;font-weight:700}.service-left h3{color:#fff;letter-spacing:4px;text-transform:uppercase;font-family:Bebas Neue,sans-serif;font-size:30px;font-weight:700;transition:all .5s}.service-arrow{color:#fff;background:#ffffff14;border:1px solid #ffffff14;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;transition:all .5s;display:flex}.service-item:hover{border-color:#9e140b;transform:translate(14px);box-shadow:0 18px 45px #9e140b29}.service-item:hover .service-video{opacity:.55}.service-item:hover .service-left h3{transform:translate(8px)}.service-item:hover .service-arrow{background:#9e140b;transform:rotate(45deg)}.services-preview{background:#111;border:1px solid #ffffff14;border-radius:42px;width:100%;max-width:430px;height:500px;margin-left:auto;transition:all .6s;position:relative;overflow:hidden;box-shadow:0 20px 50px #00000040}.services-preview:before{content:"";filter:blur(100px);z-index:1;background:#9e140b2e;border-radius:50%;width:280px;height:280px;position:absolute;top:-80px;right:-80px}.preview-video{z-index:2;object-fit:cover;object-position:center;will-change:transform;width:100%;height:100%;transition:all 1s;position:absolute;inset:0;transform:translateZ(0)}.services-preview:hover .preview-video{transform:scale(1.03)}.preview-overlay{z-index:3;background:linear-gradient(#00000026,#000000e0);position:absolute;inset:0}.preview-badge{z-index:5;color:#fff;text-transform:uppercase;letter-spacing:.25em;background:#ffffff14;border:1px solid #ffffff1a;border-radius:999px;padding:14px 22px;font-family:Inter,sans-serif;font-size:11px;position:absolute;bottom:28px;left:28px}@media (max-width:1100px){.services-section{padding:100px 60px}.services-grid{grid-template-columns:1fr;gap:60px}.services-preview{max-width:100%;height:580px;margin:auto}}@media (max-width:768px){.services-section{padding:100px 25px}.services-heading{font-size:48px}.services-description{font-size:15px}.services-grid{margin-top:70px}.service-item{border-radius:24px;height:100px}.service-content{padding:0 20px}.service-left{gap:16px}.service-left h3{letter-spacing:2px;font-size:22px}.service-arrow{width:42px;height:42px;font-size:17px}.services-preview{border-radius:28px;height:450px}.preview-badge{font-size:10px;bottom:20px;left:20px}}
