/* OPAL görgetős hero. Tokenek a theme.json palettájából; a fallback értékek azonosak. */
.opal-hs{--alap:var(--wp--preset--color--alap,#262628);--mely:var(--wp--preset--color--mely,#1A1A1C);--tinta:var(--wp--preset--color--tinta,#F4F1EC);--masod:var(--wp--preset--color--masod,#A5A29C);--vonal:var(--wp--preset--color--vonal,#3D3D41);--vonal-ero:var(--wp--preset--color--vonal-ero,#55555B);--mohazold:var(--wp--preset--color--mohazold,#7B972B);--papir:#FFFFFF;
  position:relative;height:460vh;background:var(--alap);color:var(--tinta);font-family:Jost,system-ui,sans-serif;font-size:16px;line-height:1.55}
.opal-hs.is-static{height:100vh;height:100svh}
.opal-hs__pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--alap)}
.opal-hs__stage{position:absolute;inset:0;z-index:0;isolation:isolate}
.opal-hs__layer{position:absolute;left:0;top:0;width:100%;height:100%;background:center/cover no-repeat;transform-origin:0 0;opacity:0;visibility:hidden;will-change:transform,opacity}
.opal-hs__layer[data-f="0"]{opacity:1;visibility:visible}
.opal-hs__label{font-size:13px;font-weight:500;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;color:var(--masod)}

.opal-hs__intro{position:absolute;z-index:3;left:0;right:0;bottom:clamp(20px,4vh,48px);display:flex;flex-direction:column;align-items:center;gap:20px;padding:0 20px;text-align:center;will-change:transform,opacity}
.opal-hs__title{margin:0;font-weight:300;font-size:clamp(40px,6.2vw,88px);line-height:1.05;letter-spacing:-.02em;text-wrap:balance}

.opal-hs__caps{list-style:none;margin:0;padding:0;position:absolute;z-index:3;inset:0;pointer-events:none}
.opal-hs__cap{position:absolute;display:flex;flex-direction:column;gap:8px;padding:16px 20px;background:var(--mely);opacity:0;will-change:transform,opacity}
.opal-hs__cap p{margin:0;font-size:19px;line-height:1.3;text-wrap:pretty}
.opal-hs__cap[data-c="0"]{left:clamp(20px,4vw,48px);top:clamp(96px,22vh,240px);max-width:min(320px,calc(40% - 40px),calc(100% - 40px));min-width:min(240px,calc(100% - 40px))}
.opal-hs__cap[data-c="1"]{right:clamp(20px,4vw,48px);top:clamp(96px,30vh,320px);max-width:min(380px,calc(100% - 40px))}

.opal-hs__buy{position:absolute;z-index:3;right:clamp(20px,4vw,48px);bottom:clamp(24px,7vh,72px);width:min(380px,calc(100% - 40px));box-sizing:border-box;display:flex;flex-direction:column;gap:16px;padding:24px;margin:0;background:var(--mely);border:1px solid var(--vonal);opacity:0;visibility:hidden;will-change:transform,opacity}
.opal-hs__name{font-size:26px;line-height:1.2;letter-spacing:-.005em;color:var(--tinta);text-decoration:none}
.opal-hs__row{display:flex;align-items:center;gap:10px}
.opal-hs__dot{width:14px;height:14px;border-radius:50%;background:var(--mohazold);box-shadow:0 0 0 1px var(--vonal-ero);flex:none}
.opal-hs__link{margin-left:auto;min-height:44px;display:flex;align-items:center;color:var(--masod);text-underline-offset:3px;text-decoration-color:var(--masod)}
.opal-hs__link:hover{color:var(--tinta);text-decoration-color:var(--tinta)}
.opal-hs__price{font-size:19px;line-height:1.3;font-variant-numeric:tabular-nums}
.opal-hs__muted{color:var(--masod)}
.opal-hs__ok{display:none;flex-direction:column;gap:12px}
.opal-hs__ok-line{display:flex;align-items:center;gap:8px}
.opal-hs.is-added .opal-hs__ok{display:flex}
.opal-hs.is-added .opal-hs__add{display:none}

.opal-hs__btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 28px;box-sizing:border-box;border:1px solid var(--tinta);background:var(--tinta);color:var(--alap);font:500 13px/1 Jost,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-radius:0;cursor:pointer;transition:background-color 140ms cubic-bezier(.16,1,.3,1),border-color 140ms cubic-bezier(.16,1,.3,1),color 140ms cubic-bezier(.16,1,.3,1)}
.opal-hs__btn:hover{background:var(--papir);border-color:var(--papir)}
.opal-hs__btn--sec{background:transparent;color:var(--tinta);border-color:var(--masod)}
.opal-hs__btn--sec:hover{background:transparent;border-color:var(--tinta)}
.opal-hs__btn--full{width:100%}
.opal-hs__btn[aria-busy="true"]{cursor:progress;background:var(--mely);color:var(--masod);border-color:var(--vonal)}
.opal-hs__btn:focus-visible,.opal-hs__link:focus-visible,.opal-hs__name:focus-visible{outline:2px solid var(--tinta);outline-offset:2px}

.opal-hs__rail{position:absolute;z-index:3;right:clamp(14px,2vw,28px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px}
.opal-hs__rail span{display:block;width:2px;height:28px;background:var(--vonal-ero)}
.opal-hs__rail span.is-on{background:var(--tinta)}
.opal-hs__hint{position:absolute;z-index:3;left:50%;top:clamp(20px,4vh,40px);transform:translateX(-50%)}
.opal-hs.is-static .opal-hs__rail,.opal-hs.is-static .opal-hs__hint,.opal-hs.is-static .opal-hs__caps,.opal-hs.is-static .opal-hs__buy{display:none}
.opal-hs__sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (prefers-reduced-motion:reduce){.opal-hs *{transition-duration:0ms!important}}
