/* Vonia – homepage (Press Play, 2026). Načítava sa v HEAD, bloky vkladá vonia-home.js */
:root{--vn-brown:#3b2320;--vn-text:#3f3431;--vn-muted:#7d6e68;--vn-cream:#fbf8f4;--vn-sand:#f3ece4;--vn-line:#e9dfd4;--vn-peach:#f2a074;--vn-peach-d:#df8657;--vn-serif:'Fraunces',Georgia,serif}
.top-navigation-bar .top-navigation-menu,.top-navigation-bar .top-navigation-menu-trigger{display:none!important}
body.type-index:not(.vn-carousel) .banners-row{display:none}
.vn-full{width:100vw;margin-left:calc(50% - 50vw)}
.vn-in{max-width:1180px;margin:0 auto;padding:0 24px}
.vn-h2{font-family:var(--vn-serif);font-weight:600;color:var(--vn-brown);font-size:34px;line-height:1.15;margin:0 0 8px;letter-spacing:-.01em}
.vn-lead{margin:0 0 26px;color:var(--vn-muted);font-size:16px;line-height:1.55}
.vn-btn{display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;line-height:1;text-decoration:none!important;border-radius:999px;padding:16px 26px;transition:background .2s,color .2s}
.vn-btn--primary{background:var(--vn-peach);color:#2b1a16!important}
.vn-btn--primary:hover{background:var(--vn-peach-d)}
.vn-btn--ghost{border:2px solid var(--vn-brown);color:var(--vn-brown)!important}
.vn-btn--ghost:hover{background:var(--vn-brown);color:#fff!important}
.vn-eyebrow{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--vn-peach-d);margin-bottom:16px}
.vn-hero{background:linear-gradient(180deg,#e6e6e6 0%,#f4f4f3 70%,#fbfbfb 100%);overflow:hidden;margin-top:-1px}
.vn-hero .vn-in{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:24px}
.vn-hero__txt{padding:56px 0}
.vn-hero h2{font-family:var(--vn-serif);font-weight:600;color:var(--vn-brown);font-size:58px;line-height:1.04;letter-spacing:-.02em;margin:0 0 20px}
.vn-hero p{font-size:18px;line-height:1.6;color:var(--vn-text);margin:0 0 28px;max-width:30em}
.vn-hero__pm{display:none}
.vn-hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.vn-rating{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:14px;font-weight:700;color:var(--vn-brown)}
.vn-stars{color:#e9a23b;letter-spacing:2px;font-size:16px}
.vn-hero__img{align-self:end;display:flex;justify-content:center}
.vn-hero__img img{display:block;width:100%;max-width:500px;height:auto;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%)}
.vn-nav{padding:56px 0 8px}
.vn-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.vn-tile{position:relative;display:block;aspect-ratio:4/5;border-radius:18px;overflow:hidden;text-decoration:none!important;color:#fff!important;background:#ddd}
.vn-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.vn-tile:hover img{transform:scale(1.04)}
.vn-tile:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(43,26,22,0) 35%,rgba(43,26,22,.55) 62%,rgba(43,26,22,.88) 100%)}
.vn-tile__t{position:absolute;left:20px;right:20px;bottom:20px;z-index:2}
.vn-tile__t b{display:block;font:600 24px/1.15 var(--vn-serif);margin-bottom:4px}
.vn-tile__t span{display:block;font-size:14px;font-weight:600;line-height:1.35}
.vn-tile__t em{display:inline-block;margin-top:12px;font-style:normal;font-size:13px;font-weight:700;border-bottom:2px solid var(--vn-peach)}
body.type-index .benefitBanner.position--benefitHomepage{margin:32px auto 48px;border-top:1px solid var(--vn-line);border-bottom:1px solid var(--vn-line);padding:22px 0}
.benefitBanner__title{color:var(--vn-brown)}
body.type-index .homepage-group-title{font-family:var(--vn-serif);font-weight:600;color:var(--vn-brown);letter-spacing:-.01em;text-align:left;margin-top:24px}
.vn-mood{padding:56px 0}
.vn-mood__cols{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.vn-mood__box{background:#fff;border:1px solid var(--vn-line);border-radius:18px;padding:24px}
.vn-mood__box h3{font:600 22px/1.2 var(--vn-serif);color:var(--vn-brown);margin:0 0 4px}
.vn-mood__box p{margin:0 0 18px;font-size:14px;color:var(--vn-muted)}
.vn-chips{display:flex;flex-wrap:wrap;gap:10px}
.vn-chip{display:inline-flex;align-items:center;gap:9px;padding:10px 16px 10px 10px;border-radius:999px;background:var(--vn-cream);border:1px solid var(--vn-line);text-decoration:none!important;font-weight:700;font-size:14.5px;color:var(--vn-brown)!important;transition:border-color .2s}
.vn-chip:hover{border-color:var(--vn-peach)}
.vn-chip i{width:22px;height:22px;border-radius:50%;flex:0 0 22px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
body.type-index .welcome-wrapper{max-width:none;width:100vw;margin-left:calc(50% - 50vw);background:var(--vn-sand);padding:64px 0}
body.type-index .welcome-wrapper .welcome{max-width:1180px;margin:0 auto;padding:0 24px 0 calc(min(44%,520px) + 72px);position:relative;min-height:340px;display:flex;flex-direction:column;justify-content:center}
body.type-index .welcome-wrapper .welcome:before{content:"";position:absolute;left:24px;top:0;bottom:0;width:min(44%,520px);border-radius:20px;background:#ddd url(/user/documents/upload/homepage/pribeh-vyroba.jpg) center/cover}
body.type-index .welcome .h1,body.type-index .welcome h1,body.type-index .welcome h2{font-family:var(--vn-serif);font-weight:600;color:var(--vn-brown);font-size:34px;line-height:1.15;margin:0 0 14px;text-align:left}
body.type-index .welcome p{font-size:17px;line-height:1.7;text-align:left}
.vn-reviews{padding:56px 0}
.vn-reviews__head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:24px}
.vn-reviews__head a{font-weight:700;color:var(--vn-brown)!important;text-decoration:none!important;border-bottom:2px solid var(--vn-peach)}
.vn-reviews__in{display:grid;grid-template-columns:.8fr 1fr 1fr;gap:18px}
.vn-score{background:var(--vn-brown);color:#fff;border-radius:18px;padding:28px;display:flex;flex-direction:column;justify-content:center}
.vn-score b{font:600 60px/1 var(--vn-serif)}
.vn-score span{opacity:.85;margin-top:6px}
.vn-review{margin:0;border:1px solid var(--vn-line);background:#fff;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:12px}
.vn-review q{font:500 20px/1.4 var(--vn-serif);color:var(--vn-brown)}
.vn-review small{color:var(--vn-muted);font-size:13px;font-weight:600;margin-top:auto}
@media (max-width:991px){
 .vn-hero h2{font-size:44px}
 .vn-tiles{grid-template-columns:repeat(2,1fr)}
 .vn-mood__cols{grid-template-columns:1fr}
 .vn-reviews__in{grid-template-columns:1fr}
 body.type-index .welcome-wrapper .welcome{padding:0 24px}
 body.type-index .welcome-wrapper .welcome:before{position:static;display:block;width:100%;aspect-ratio:16/10;margin-bottom:24px}
}
@media (max-width:767px){
 .vn-in{padding:0 16px}
 .vn-hero .vn-in{display:block;position:relative;min-height:min(calc(100svh - 110px),680px)}
 .vn-hero__txt{position:relative;z-index:2;padding:36px 0 0}
 .vn-hero h2{font-size:38px;margin-bottom:12px}
 .vn-hero p.vn-hero__p{display:none}
 .vn-hero p.vn-hero__pm{display:block;font-size:16px;line-height:1.55;margin:0 0 20px;max-width:21em}
 .vn-hero__cta{flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:16px}
 .vn-hero__cta .vn-btn{padding:14px 22px;font-size:14px}
 .vn-rating{font-size:12.5px;max-width:52%}
 .vn-hero__img{position:absolute;z-index:1;right:-24px;bottom:0;width:70%;max-width:320px}
 .vn-hero__img img{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%),linear-gradient(90deg,transparent 0,#000 30%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent 0,#000 30%),linear-gradient(90deg,transparent 0,#000 30%);mask-composite:intersect}
 .vn-h2{font-size:28px}
 .vn-nav{padding-top:40px}
 .vn-tiles{gap:12px}
 .vn-tile__t{left:14px;right:14px;bottom:14px}
 .vn-tile__t b{font-size:19px}
 .vn-tile__t span{font-size:12.5px}
 .vn-tile__t em{display:none}
 .vn-reviews__head{flex-direction:column;align-items:flex-start}
 .benefitBanner{display:flex!important;flex-wrap:nowrap!important;align-items:flex-start;gap:8px}
 body.type-index .benefitBanner.position--benefitHomepage{margin:24px auto 28px;padding:16px 0}
 .benefitBanner .benefitBanner__item{flex:1 1 0!important;min-width:0;margin:0!important;flex-direction:column;align-items:center;text-align:center}
 .benefitBanner .benefitBanner__link{flex-direction:column;align-items:center;text-align:center}
 .benefitBanner .benefitBanner__picture{flex:0 0 auto!important;width:40px!important;margin:0 0 6px!important}
 .benefitBanner .benefitBanner__img{width:40px!important;height:40px!important}
 .benefitBanner .benefitBanner__title{display:block;font-size:11.5px!important;line-height:1.3!important}
}