.barvio-flow{--ink:#081426;--orange:#ff7100;display:block!important;width:100%;max-width:1394px;margin:40px auto!important;float:none;clear:both;box-sizing:border-box;font-family:inherit;color:var(--ink);text-align:left}
.barvio-flow *{box-sizing:border-box}
.barvio-flow .bf-menu{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 28px;padding:0 12px 24px;margin:0;border-bottom:1px solid #dae1e3}
.barvio-flow .bf-menu a{color:#435a68;font-size:14px;text-underline-offset:6px;text-decoration:none}
.barvio-flow .bf-menu a:hover{color:#9e4100;text-decoration:underline}
.barvio-flow .bf-section{position:relative;margin:0;padding:64px 0;border-bottom:1px solid #dae1e3;scroll-margin-top:120px;min-width:0}
.barvio-flow .bf-section:first-of-type{padding-top:34px}
.barvio-flow .bf-section:last-of-type{border:0;padding-bottom:0}
.barvio-flow .bf-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;min-width:0}
.barvio-flow .bf-label{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:800;color:#9e4100;margin-bottom:16px}
.barvio-flow .bf-label span{font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid #edceb6;border-radius:50%;letter-spacing:0}
.barvio-flow h2{color:var(--ink);font-size:clamp(30px,4.3vw,57px);line-height:1.08;letter-spacing:-.045em;margin:0 0 20px;font-weight:750}
.barvio-flow h2 em{font-style:normal;color:#b54b00}
.barvio-flow p{max-width:530px;color:#536875;font-size:17px;line-height:1.6;margin:0 0 24px}
.barvio-flow .bf-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;color:var(--ink);background:var(--orange);border-radius:6px;padding:14px 20px;font-size:14px;line-height:1.3;font-weight:800;text-decoration:none}
.barvio-flow .bf-cta:hover{background:#081426;color:white}
.barvio-flow :focus-visible{outline:3px solid #ff7100;outline-offset:5px}
.barvio-flow .bf-sale{padding:34px;border-radius:12px;background:#f5ece2}
.barvio-flow .bf-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-width:0}
.barvio-flow .bf-products--two{grid-template-columns:repeat(2,minmax(0,1fr))}
.barvio-flow .bf-card{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:var(--ink);background:#fff;border:1px solid #dce3e6;border-radius:10px;padding:18px;transition:border-color .2s}
.barvio-flow .bf-card:hover{border-color:#ff7100}
.barvio-flow .bf-card img{display:block;width:100%;height:185px;object-fit:contain;max-width:none;background:white;margin-bottom:20px}
.barvio-flow .bf-card strong{font-size:16px;line-height:1.4;color:var(--ink);margin-bottom:16px}
.barvio-flow .bf-card small{display:flex;justify-content:space-between;margin-top:auto;font-size:12px;font-weight:700;color:#964000}
.barvio-flow .bf-sale .bf-products{gap:10px}
.barvio-flow .bf-sale .bf-card{padding:12px}
.barvio-flow .bf-sale .bf-card img{height:150px}
.barvio-flow .bf-sale .bf-card strong{font-size:14px}
.barvio-flow .bf-section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:26px}
.barvio-flow .bf-section-head h2{margin-bottom:0}
.barvio-flow .bf-section-head p{font-size:15px;max-width:390px;margin:0}
.barvio-flow .bf-surfaces{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.barvio-flow .bf-surface{position:relative;display:flex;flex-direction:column;justify-content:end;min-height:230px;border:1px solid #dce3e6;border-radius:10px;padding:24px;text-decoration:none;color:var(--ink);overflow:hidden;background:#fff}
.barvio-flow .bf-surface:before{content:'';display:block;height:110px;position:absolute;inset:0 0 auto;background:linear-gradient(115deg,#eee9dd 0 55%,#839a99 55%)}
.barvio-flow .bf-surface[data-surface=wood]:before{background:repeating-linear-gradient(2deg,#bf8756 0 12px,#cd9a67 12px 16px,#b97d4e 16px 18px)}
.barvio-flow .bf-surface[data-surface=metal]:before{background:linear-gradient(120deg,#54707d,#e1e6e7 45%,#8ba0a9 46%,#c6d0d4 80%)}
.barvio-flow .bf-surface[data-surface=concrete]:before{background:linear-gradient(135deg,#b5b9b4,#e4e5df 45%,#a2aba7)}
.barvio-flow .bf-surface strong{font-size:21px;color:var(--ink);margin-bottom:8px}
.barvio-flow .bf-surface small{font-size:13px;color:#536875;display:flex;justify-content:space-between}
.barvio-flow .bf-surface:hover{border-color:#ff7100}
.barvio-flow .bf-osmo{display:flex;align-items:center;justify-content:center;background:#eae4d9;border-radius:12px;padding:24px;min-width:0}
.barvio-flow .bf-osmo img{width:min(100%,240px);height:auto;display:block;border-radius:4px;box-shadow:0 12px 35px #08142622}
.barvio-flow .bf-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.barvio-flow .bf-pills span{font-size:12px;border:1px solid #d5dedf;border-radius:30px;padding:7px 12px;color:#415561}
.barvio-flow .bf-note{font-size:13px;color:#6a7072;padding:12px 16px;background:#eff2f3;border-radius:6px;margin-bottom:20px;line-height:1.5}
.barvio-flow .bf-empty{padding:26px;background:#eef2f3;border-radius:8px;font-size:15px;color:#526874}
.barvio-flow .bf-new{background:#081426;padding:36px;border-radius:12px}
.barvio-flow .bf-new h2,.barvio-flow .bf-new .bf-label{color:white}
.barvio-flow .bf-new .bf-label span{border-color:#ffffff50;color:#ffae70}
.barvio-flow .bf-new p{color:#cbd6df}
.barvio-flow .bf-new .bf-note{color:#cbd6df;background:#ffffff10}
.barvio-flow .bf-reveal{opacity:1;transform:none}
@media(prefers-reduced-motion:no-preference){.barvio-flow.bf-motion .bf-reveal{opacity:0;transform:translateY(30px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}.barvio-flow.bf-motion .bf-reveal.is-visible{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.barvio-flow .bf-split{grid-template-columns:1fr;gap:26px}.barvio-flow .bf-surfaces{grid-template-columns:repeat(2,minmax(0,1fr))}.barvio-flow .bf-section-head{display:block}.barvio-flow .bf-section-head p{margin-top:16px}.barvio-flow .bf-osmo{order:2}.barvio-flow .bf-osmo img{width:210px}.barvio-flow h2{font-size:40px}}
@media(max-width:560px){.barvio-flow{margin:24px auto!important}.barvio-flow .bf-menu{justify-content:flex-start;gap:14px 20px;padding-left:0;padding-right:0}.barvio-flow .bf-menu a{font-size:12px}.barvio-flow .bf-section{padding:36px 0}.barvio-flow .bf-sale,.barvio-flow .bf-new{padding:24px 18px}.barvio-flow h2{font-size:34px}.barvio-flow p{font-size:16px}.barvio-flow .bf-products{grid-template-columns:1fr}.barvio-flow .bf-card{display:grid;grid-template-columns:90px 1fr;gap:10px 16px;align-items:center;padding:14px}.barvio-flow .bf-card img,.barvio-flow .bf-sale .bf-card img{height:100px;margin:0;grid-row:span 2}.barvio-flow .bf-card strong{font-size:15px;margin:0}.barvio-flow .bf-card small{margin:0}.barvio-flow .bf-sale .bf-products{grid-template-columns:1fr}.barvio-flow .bf-surfaces{gap:10px}.barvio-flow .bf-surface{padding:18px;min-height:190px}.barvio-flow .bf-surface:before{height:85px}.barvio-flow .bf-surface strong{font-size:18px}.barvio-flow .bf-surface small{font-size:12px}.barvio-flow .bf-note{font-size:12px}}
/* v4: align with the existing hero and animate only small vertical distances. */
.barvio-flow{width:var(--bf-width,100%);max-width:none;margin-left:calc((100% - var(--bf-width,100%))/2)!important;margin-right:calc((100% - var(--bf-width,100%))/2)!important}
.barvio-flow h2{font-family:inherit;font-weight:800;font-size:clamp(32px,3.9vw,54px)}
.barvio-flow .bf-section{padding:72px 0}
.barvio-flow .bf-menu{gap:8px;padding-bottom:26px}
.barvio-flow .bf-menu a{padding:9px 16px;border-radius:50px;transition:background .2s,color .2s;text-decoration:none}
.barvio-flow .bf-menu a:hover,.barvio-flow .bf-menu a[aria-current=true]{background:#fff0e4;color:#9e4100}
.barvio-flow .bf-label:after{content:'';height:1px;width:42px;background:#ff7100;opacity:.6;transform-origin:left}
.barvio-flow .bf-label span{background:#fff;border:0;box-shadow:inset 0 0 0 1px #e1d9d0;width:34px;height:34px}
.barvio-flow .bf-sale{padding:44px;border-radius:24px;background:radial-gradient(ellipse at 95% 0,#ffdab780,transparent 65%),linear-gradient(125deg,#fbf5ed,#f0e4d5);border:1px solid #ebded0}
.barvio-flow .bf-cta{padding:16px 22px;border-radius:8px;box-shadow:0 7px 20px #d65e0014;transition:background .2s,box-shadow .2s,transform .2s}
.barvio-flow .bf-cta:hover{transform:translateY(-2px);box-shadow:0 9px 22px #08142620}
.barvio-flow .bf-cta>span{transition:transform .25s}
.barvio-flow .bf-cta:hover>span{transform:translate(3px,-3px)}
.barvio-flow .bf-card{position:relative;padding:24px;border-color:#e2e7e9;border-radius:16px;box-shadow:0 3px 15px #08142603;transition:border-color .25s,box-shadow .25s}
.barvio-flow .bf-card:hover{box-shadow:0 15px 40px #0814260b;border-color:#dfab82}
.barvio-flow .bf-card img{height:200px;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.barvio-flow .bf-card:hover img{transform:translateY(-5px) scale(1.025)}
.barvio-flow .bf-card strong{font-size:17px;margin-bottom:14px}
.barvio-flow .bf-card small{border-top:1px solid #eef1f2;padding-top:14px;color:#526774}
.barvio-flow .bf-card small>span{color:#b54b00;transition:transform .25s}
.barvio-flow .bf-card:hover small>span{transform:translate(3px,-3px)}
.barvio-flow .bf-price{display:block;font-size:20px;font-weight:800;color:#081426;margin:0 0 14px;line-height:1.3}
.barvio-flow .bf-price:after{content:' vč. DPH';font-size:10px;font-weight:500;color:#657a85;white-space:nowrap}
.barvio-flow .bf-sale .bf-card{padding:20px;box-shadow:0 12px 32px #08142607}
.barvio-flow .bf-sale .bf-card img{height:180px}
.barvio-flow .bf-surface{padding:0;border-radius:16px;min-height:280px;transition:border-color .25s,box-shadow .25s;background:#fff}
.barvio-flow .bf-surface:before{display:none}
.barvio-flow .bf-surface img{display:block;width:100%;height:170px;object-fit:contain;background:#f1f3f1;padding:14px;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.barvio-flow .bf-surface strong{margin:20px 22px 6px}
.barvio-flow .bf-surface small{margin:0 22px 20px}
.barvio-flow .bf-surface:hover{box-shadow:0 12px 30px #08142609}
.barvio-flow .bf-surface:hover img{transform:scale(1.045)}
.barvio-flow .bf-osmo{position:relative;border-radius:24px;min-height:510px;background:radial-gradient(ellipse at 20% 10%,#fff8,transparent 60%),#e8dfd1;overflow:hidden}
.barvio-flow .bf-osmo:before{content:'OSMO';position:absolute;left:18px;bottom:-20px;font-size:clamp(80px,12vw,166px);line-height:1;font-weight:900;letter-spacing:-.09em;color:#4a3b2b06;pointer-events:none}
.barvio-flow .bf-osmo img{position:relative;width:min(100%,246px);border-radius:8px;transform:translateY(var(--bf-drift,0px));will-change:auto}
.barvio-flow .bf-new{border-radius:24px;padding:44px;background:radial-gradient(ellipse at 95% 100%,#3a291d,transparent 60%),#081426}
.barvio-flow .bf-new .bf-label span{background:#ffffff0a;box-shadow:inset 0 0 0 1px #ffffff30}
.barvio-flow .bf-empty{padding:28px;border:1px solid #dce3e6;min-width:0;line-height:1.6}
.barvio-flow .bf-products>.bf-empty{grid-column:1/-1}
.barvio-flow [data-popular]{min-height:340px}
.barvio-flow [data-actions]{min-height:310px}
.barvio-flow .bf-new .bf-empty{background:#ffffff08;border-color:#ffffff1c;color:#d6e0e7}
.barvio-flow .bf-new .bf-empty a{display:inline-block;color:white;margin-top:14px;text-underline-offset:5px}
.barvio-flow .bf-anchor{position:absolute;top:0;scroll-margin-top:120px}
.barvio-flow .bf-reveal{transition-delay:var(--bf-delay,0ms)!important}
@media(prefers-reduced-motion:no-preference){.barvio-flow.bf-motion .bf-reveal{transform:translateY(24px);transition-duration:.75s;transition-timing-function:cubic-bezier(.16,1,.3,1)}.barvio-flow.bf-motion .bf-reveal:not(.is-visible) .bf-label:after{transform:scaleX(0)}.barvio-flow .bf-label:after{transition:transform .8s cubic-bezier(.16,1,.3,1)}}
@media(max-width:900px){.barvio-flow .bf-osmo{min-height:440px}.barvio-flow .bf-section{padding:48px 0}.barvio-flow .bf-sale,.barvio-flow .bf-new{padding:32px}.barvio-flow .bf-card img{height:180px}}
@media(max-width:560px){.barvio-flow .bf-menu{justify-content:center;gap:4px}.barvio-flow .bf-menu a{padding:8px 10px;font-size:12px}.barvio-flow .bf-section{padding:34px 0}.barvio-flow .bf-sale,.barvio-flow .bf-new{padding:26px 18px;border-radius:18px}.barvio-flow .bf-card,.barvio-flow .bf-sale .bf-card{padding:16px;gap:10px 14px}.barvio-flow .bf-card img,.barvio-flow .bf-sale .bf-card img{height:110px;grid-row:span 3}.barvio-flow .bf-card strong{font-size:15px;margin:0}.barvio-flow .bf-price{font-size:17px;margin:0}.barvio-flow .bf-card small{padding-top:7px;font-size:11px}.barvio-flow .bf-surface{min-height:218px;border-radius:12px}.barvio-flow .bf-surface img{height:125px;padding:10px}.barvio-flow .bf-surface strong{font-size:19px;margin:16px 16px 4px}.barvio-flow .bf-surface small{margin:0 16px 16px;font-size:11px}.barvio-flow .bf-osmo{min-height:430px;border-radius:18px}.barvio-flow .bf-osmo img{width:210px}.barvio-flow h2{font-size:35px}}
@media(prefers-reduced-motion:reduce){.barvio-flow *{transition:none!important;animation:none!important}.barvio-flow .bf-card:hover img,.barvio-flow .bf-surface:hover img,.barvio-flow .bf-cta:hover,.barvio-flow .bf-osmo img{transform:none!important}}
@media(max-width:560px){.barvio-flow [data-popular]{min-height:350px}.barvio-flow [data-actions]{min-height:240px}}
