/* Single original photograph; only the oil inside its silhouette is animated. */
.home .oil-hero{position:relative;isolation:isolate;height:500px;overflow:hidden;background:#252D34;color:#F5F7F9;font-family:var(--js-font,Ubuntu,Arial,sans-serif)}
.home .oil-hero__scene,.home .oil-hero__shade{position:absolute;inset:0;pointer-events:none}
.home .oil-hero__frame{position:absolute;left:50%;top:50%;width:max(100%,754.573px);aspect-ratio:1980/1312;transform:translate(-50%,-50%)}
.home .oil-hero__photo{display:block;width:100%;height:100%;max-width:none;object-fit:fill}
.home .oil-hero__flow{position:absolute;left:48.484848%;top:28.963415%;width:6.464646%;height:60.97561%;max-width:none;opacity:0;pointer-events:none;clip-path:polygon(67.1875% 1.25%,93.75% 1.75%,62.5% 27.5%,46.875% 52.5%,35.9375% 77.5%,29.6875% 97.5%,12.5% 97.5%,14.0625% 77.5%,21.875% 52.5%,34.375% 27.5%,53.125% 7.5%);transition:opacity .25s ease}
.home .oil-hero__flow.is-playing{opacity:1}
/* C: the moving silhouette is composited per video frame. This wider feathered
   corridor replaces the old oil-only polygon and covers its former edge. */
.home .oil-hero__flow.oil-hero__flow--contour{left:47.474747%;top:22.865854%;width:12.929293%;height:68.597561%;clip-path:none;mask-image:url('../../uploads/2026/11/oil-flow-c-blend.svg');mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-image:url('../../uploads/2026/11/oil-flow-c-blend.svg');-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
.home .oil-hero__shade{background:linear-gradient(90deg,rgba(10,15,20,.84),rgba(10,15,20,.73) 34%,rgba(10,15,20,.15) 66%,rgba(10,15,20,.08));z-index:1}
.home .oil-hero__inner{position:relative;z-index:2;display:flex;align-items:center;width:min(1170px,100%);height:100%;box-sizing:border-box;margin:0 auto;padding:28px 30px 68px}
.home .oil-hero__slides{display:grid;width:min(480px,100%)}
.home .oil-hero__slide{grid-area:1/1;display:grid;grid-template-rows:52px minmax(148px,auto) 48px;align-items:center;justify-items:start;gap:12px;min-width:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .38s ease,visibility 0s .38s}
.home .oil-hero__slide.is-active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .38s ease,visibility 0s}
.home .oil-hero__specialization{font-size:18px;line-height:1.45;font-weight:500;text-shadow:0 1px 3px #000}
.home .oil-hero__title{display:block;max-width:100%;font-size:clamp(30px,3.05vw,46px);font-weight:400;line-height:1.18;overflow-wrap:break-word;text-wrap:balance;text-shadow:0 1px 3px #000}
.home .oil-hero__link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;box-sizing:border-box;padding:9px 24px;border:2px solid var(--js-orange,#FF6B1A);border-radius:4px;background:#252D34;color:#F5F7F9;font-size:16px;font-weight:500;line-height:24px;text-decoration:none;text-transform:uppercase;transition:background-color .18s,color .18s}
.home .oil-hero__link:hover,.home .oil-hero__link:focus-visible{background:var(--js-orange,#FF6B1A);color:#252D34;text-decoration:none}
.home .oil-hero__controls{position:absolute;z-index:3;bottom:12px;right:max(16px,calc((100% - 1110px)/2));display:flex;align-items:center;gap:8px}
.home .oil-hero__controls[hidden]{display:none}
.home .oil-hero__controls button{display:grid;place-items:center;box-sizing:border-box;width:44px;height:44px;margin:0;padding:0;border:1px solid var(--js-orange,#FF6B1A);border-radius:4px;background:#252D34;color:#F5F7F9;font:500 24px/1 var(--js-font,Ubuntu,Arial,sans-serif);cursor:pointer}
.home .oil-hero__controls button:hover{background:var(--js-orange,#FF6B1A);color:#252D34}
.home .oil-hero__controls button:disabled{cursor:default;color:#F5F7F9;background:#252D34}
.home .oil-hero__controls [data-oil-pause-icon]{display:block;box-sizing:border-box;width:12px;height:16px;border-left:4px solid currentColor;border-right:4px solid currentColor}
.home .oil-hero__controls [aria-pressed="true"] [data-oil-pause-icon]{width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid currentColor;border-right:0}
.home .oil-hero :is(a,button):focus-visible{outline:3px solid #F5F7F9;outline-offset:3px}
.home .oil-hero__count{min-width:38px;font-size:14px;line-height:24px;text-align:center;text-shadow:0 1px 3px #000}
.home .oil-hero__status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:1199px) and (min-width:768px){.home .oil-hero__slides{width:430px}.home .oil-hero__inner{padding-left:24px}.home .oil-hero__title{font-size:34px}.home .oil-hero__shade{background:linear-gradient(90deg,rgba(10,15,20,.85),rgba(10,15,20,.69) 48%,rgba(10,15,20,.12))}}
@media(max-width:767px){.home .oil-hero{height:340px}.home .oil-hero__frame{width:max(100%,513.11px)}.home .oil-hero__inner{justify-content:center;padding:16px 20px 64px}.home .oil-hero__slides{width:380px}.home .oil-hero__slide{grid-template-rows:42px minmax(100px,auto) 46px;justify-items:center;gap:9px;text-align:center}.home .oil-hero__specialization{font-size:15px;line-height:1.4}.home .oil-hero__title{font-size:clamp(22px,6vw,28px);line-height:1.2}.home .oil-hero__link{min-height:46px;padding:8px 20px;font-size:15px}.home .oil-hero__shade{background:rgba(10,15,20,.68)}.home .oil-hero__controls{bottom:8px;right:12px;gap:6px}}
@media(prefers-reduced-motion:reduce){.home .oil-hero__slide,.home .oil-hero__flow,.home .oil-hero__link{transition:none}.home .oil-hero__flow{display:none}}