@property --hue{syntax:'<number>';inherits:true;initial-value:120}
.shopify-section:has(>.hm-header-wrap){position:sticky;top:0;z-index:30}
.hm-header-wrap{overflow:visible}
body:has([data-bp-home]) #bp-studio>.skip,body:has([data-bp-home]) #bp-studio>.bp-header,body:has([data-bp-home]) #bp-studio .intro,body:has([data-bp-home]) #bp-studio #referenciak,body:has([data-bp-home]) #bp-studio #kapcsolat,body:has([data-bp-home]) #bp-studio>.bp-footer{display:none!important}
body:has([data-bp-home]) #bp-studio .designer-section{padding-top:clamp(56px,7vw,110px);padding-bottom:clamp(70px,8vw,120px)}
.js body:has([data-bp-home]) #tervezo .section-heading,.js body:has([data-bp-home]) #tervezo .designer-footnote{opacity:0;translate:0 18px;transition:opacity .9s,translate .9s cubic-bezier(.19,1,.22,1)}
.js body:has([data-bp-home]) #tervezo .designer{clip-path:inset(9% 5% 9% 5% round 14px);transition:clip-path 1.5s cubic-bezier(.77,0,.18,1) .1s}
.js body:has([data-bp-home]) #tervezo.hm-in .designer{clip-path:inset(0 0 0 0 round 4px)}
.js body:has([data-bp-home]) #tervezo.hm-in .section-heading{opacity:1;translate:0 0}
.js body:has([data-bp-home]) #tervezo.hm-in .designer-footnote{opacity:1;translate:0 0;transition-delay:1s}
.hm-wrap{max-width:1600px;margin:0 auto;padding:0 4%}
.hm-hero{max-width:1600px;margin:auto;padding:clamp(40px,6vw,90px) 4% clamp(40px,5vw,70px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,60px);align-items:center;min-height:calc(100svh - 83px - 120px)}
.hm-title{font-size:clamp(56px,8.4vw,160px);line-height:.88;letter-spacing:-.065em;font-weight:500;margin:0 0 40px}
.hm-title .muted,.hm-h2 .muted{color:#9ca092}
.hm-lead{font-size:clamp(15px,1.3vw,19px);line-height:1.6;color:#6e7369;max-width:440px;margin:0 0 36px}
.hm-actions{display:flex;flex-wrap:wrap;gap:12px}
.hm-btn{display:inline-flex;align-items:center;gap:28px;border:1px solid #cfd3c6;border-radius:99px;padding:18px 26px;font-size:13px;background:#fff;color:var(--ink);transition:gap .4s cubic-bezier(.19,1,.22,1),background .3s,color .3s,border-color .3s}
.hm-btn span{font-size:18px;line-height:1}
.hm-btn:hover{gap:44px;border-color:var(--ink)}
.hm-btn--dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.hm-btn--dark:hover{background:var(--sage);border-color:var(--sage)}
.js .hm-fade{opacity:0;translate:0 16px;transition:opacity 1s var(--dl,0s),translate 1s cubic-bezier(.19,1,.22,1) var(--dl,0s)}
.is-ready .hm-fade{opacity:1;translate:0 0}
.hm-stage{position:relative;height:clamp(380px,60vh,700px);--mx:0;--my:0;animation:hm-hue 48s linear infinite}
@keyframes hm-hue{to{--hue:480}}
.hm-stage:before{content:'';position:absolute;inset:4% 2%;border-radius:50%;background:radial-gradient(closest-side,hsl(calc(var(--hue) + 130) 40% 88% / .85),transparent);filter:blur(12px)}
.hm-g{position:absolute;translate:calc(var(--mx) * var(--d) * 28px) calc(var(--my) * var(--d) * 22px);transition:translate .9s cubic-bezier(.19,1,.22,1),opacity 1.2s,scale 1.6s cubic-bezier(.19,1,.22,1)}
.hm-g svg{width:100%;height:auto;display:block;overflow:visible;stroke:none;filter:drop-shadow(0 30px 40px rgba(20,30,15,.22))}
.hm-g .g-fill{fill:hsl(calc(var(--hue) + var(--o)) 24% 44%)}
.hm-g .g-line{fill:none;stroke:hsl(calc(var(--hue) + var(--o)) 26% 28%);stroke-width:.6}
.hm-g .g-handle{fill:none;stroke:hsl(calc(var(--hue) + var(--o)) 24% 44%);stroke-width:1.8}
.hm-g .g-print{fill:#fafaf7;font-family:Arial,Helvetica,sans-serif}
.hm-g--hoodie{--o:0;--d:.6;width:56%;left:0;top:3%;rotate:-9deg;transition-delay:0s,.25s,.25s}
.hm-g--tee{--o:130;--d:1;width:64%;right:-2%;top:17%;z-index:2;rotate:5deg;transition-delay:0s,.4s,.4s}
.hm-g--tote{--o:250;--d:.35;width:36%;left:20%;bottom:-2%;z-index:3;rotate:-4deg;transition-delay:0s,.55s,.55s}
.hm-float{animation:hm-float 7s ease-in-out infinite}
.hm-g--tee .hm-float{animation-duration:8.5s;animation-delay:-2s}
.hm-g--tote .hm-float{animation-duration:6s;animation-delay:-4s}
@keyframes hm-float{50%{transform:translateY(-14px) rotate(1.5deg)}}
.js .hm-g{opacity:0;scale:.85}
.is-ready .hm-g{opacity:1;scale:1}
.hm-tag{position:absolute;z-index:4;display:flex;align-items:center;gap:8px;background:rgba(250,250,247,.94);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:99px;padding:9px 14px;font-size:11px;box-shadow:0 10px 30px rgba(20,30,15,.08);animation:hm-float 6s ease-in-out infinite}
.hm-tag:before{content:'';width:7px;height:7px;border-radius:50%;background:hsl(calc(var(--hue) + var(--o,0)) 30% 45%)}
.hm-tag--1{left:0;top:56%;--o:0}
.hm-tag--2{right:4%;top:4%;--o:130;animation-delay:-2s}
.hm-tag--3{right:8%;bottom:10%;--o:250;animation-delay:-4s}
.js .hm-tag{opacity:0;transition:opacity 1s 1.1s}
.is-ready .hm-tag{opacity:1}
.hm-h2{font-size:clamp(44px,6.5vw,112px);line-height:.9;letter-spacing:-.06em;font-weight:500;margin:0}
.js [data-reveal] .ref-line>span{transform:translateY(108%)}
.js [data-reveal].is-in .ref-line>span{transform:none}
.hm-process{padding:clamp(80px,10vw,150px) 0;border-top:1px solid var(--line)}
.hm-steps{list-style:none;margin:clamp(50px,6vw,90px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.4vw,40px)}
.hm-step{position:relative;padding-top:28px}
.hm-step:before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:var(--ink);transform-origin:left}
.js .hm-step:before{transform:scaleX(0);transition:transform 1.2s cubic-bezier(.77,0,.18,1) calc(var(--i) * .15s)}
.js .hm-step.is-in:before{transform:none}
.hm-step-num{display:block;font-size:clamp(64px,7vw,120px);font-weight:500;letter-spacing:-.06em;line-height:.9;color:transparent;-webkit-text-stroke:1px #9ca092;margin-bottom:28px;transition:color .5s}
.hm-step:hover .hm-step-num{color:var(--sage);-webkit-text-stroke-color:var(--sage)}
.hm-step h3{font-size:22px;font-weight:500;letter-spacing:-.03em;margin:0 0 10px}
.hm-step p{font-size:14px;line-height:1.65;color:var(--muted);margin:0;max-width:300px}
.js .hm-step>*{opacity:0;translate:0 20px;transition:opacity .9s calc(var(--i) * .15s + .2s),translate .9s cubic-bezier(.19,1,.22,1) calc(var(--i) * .15s + .2s)}
.js .hm-step.is-in>*{opacity:1;translate:0 0}
.hm-refs{padding:clamp(80px,10vw,150px) 0 clamp(90px,11vw,170px);border-top:1px solid var(--line)}
.hm-refs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:clamp(40px,5vw,80px)}
.hm-refs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,40px);align-items:start}
.hm-refs-grid .ref-card{grid-column:auto;margin-top:0}
.hm-refs-grid .ref-card:nth-child(2){margin-top:clamp(40px,8vw,140px)}
.hm-refs-grid .ref-card:nth-child(3){margin-top:clamp(20px,4vw,70px)}
.hm-refs-grid .ref-media{aspect-ratio:4/5}
@media(max-width:900px){.hm-hero{grid-template-columns:1fr;min-height:0}.hm-stage{height:clamp(320px,80vw,520px)}.hm-steps{grid-template-columns:1fr 1fr;row-gap:50px}}
@media(max-width:760px){.hm-hero{padding:32px 5% 40px}.hm-wrap{padding:0 5%}.hm-steps{grid-template-columns:1fr}.hm-btn{padding:16px 22px}.hm-refs-grid{grid-template-columns:1fr;row-gap:48px}.hm-refs-grid .ref-card:nth-child(n){margin-top:0}.hm-tag{font-size:10px;padding:7px 11px}}