.combi{color:var(--premio-navy);background:var(--premio-white);overflow-x:hidden}
.combi-wrap{width:min(calc(100% - 96px),1344px);margin:auto}
.combi-eyebrow{margin:0 0 18px;color:var(--premio-cyan);font-size:11px;font-weight:700;letter-spacing:1.5px}

.combi-hero{padding:36px 0 72px}
.combi-hero__grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-areas:"copy visual";gap:48px;align-items:start}
.combi-hero__copy{grid-area:copy;max-width:560px;min-width:0}
.combi-hero__visual{grid-area:visual;min-width:0}

/* The hero's height is driven by the copy column alone (headline/selectors/facts/CTA), not by the
   product stage. At the two-column breakpoint the visual column is taken out of row-height
   calculation (grid-area is kept, so its width/position are unchanged) and allowed to visually
   extend past the hero's own bottom edge; .combi-modes is given `position:relative` below so its
   opaque background correctly paints over that overflow instead of the image floating on top of it. */
@media(min-width:901px){
	.combi-hero__visual{position:absolute;top:0;left:0;right:0}
}

.combi h1{margin:0 0 20px;font-family:"Poppins Header","Poppins",sans-serif;font-size:clamp(38px,4.2vw,58px);font-weight:500;line-height:1.04;letter-spacing:-1.4px;color:var(--premio-navy)}
.combi-hero__lede{margin:0 0 28px;max-width:480px;font-size:16px;line-height:1.65;color:var(--premio-grey);overflow-wrap:anywhere}

/* Configurator: segmented pill selectors, no native selects. */
.combi-configurator{display:grid;gap:22px;margin-bottom:8px;min-width:0}
.combi-selector{min-width:0}
.combi-selector__label{display:block;margin-bottom:10px;font-size:10px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:var(--premio-grey)}
.combi-selector__options{display:flex;flex-wrap:wrap;gap:8px}
.combi-pill{min-height:44px;padding:10px 22px;border:1px solid rgba(16,32,51,.16);background:transparent;color:var(--premio-navy);font:600 12px/1 "Poppins",sans-serif;letter-spacing:.3px;cursor:pointer;border-radius:999px;transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.combi-pill:hover{border-color:rgba(16,32,51,.34)}
.combi-pill[aria-pressed="true"]{border-color:var(--premio-cyan);background:var(--premio-cyan);color:var(--premio-navy)}
.combi-pill[aria-pressed="true"]:hover{border-color:var(--premio-cyan);background:var(--premio-cyan)}
.combi-pill:focus-visible{outline:2px solid var(--premio-navy);outline-offset:2px}
.is-initializing .combi-pill{transition:none}

.combi-model{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:22px 0 16px;font-size:11px;font-weight:700;letter-spacing:1px;color:var(--premio-grey)}
.combi-model strong{margin-left:2px;color:var(--premio-cyan);font-size:18px}
.combi-boiler-badge{padding:5px 11px;border:1px solid var(--premio-cyan);color:var(--premio-navy);font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase}

.combi-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 24px;padding-top:18px;border-top:1px solid rgba(16,32,51,.12)}
.combi-facts>div{min-width:0}
.combi-facts dt{margin:0 0 8px;font-size:9px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--premio-grey)}
.combi-facts dd{margin:0;font-size:16px;font-weight:700;line-height:1.35;color:var(--premio-navy);overflow-wrap:anywhere}

.combi-price{margin:0 0 30px;font-size:15px;font-weight:600;color:var(--premio-grey)}

.combi-hero__actions{display:flex;flex-wrap:wrap;gap:16px}
.combi-button{display:inline-flex;min-height:52px;align-items:center;gap:12px;padding:16px 26px;border:0;background:var(--premio-cyan);color:var(--premio-navy);font:700 11px/1.3 "Poppins",sans-serif;letter-spacing:.7px;text-decoration:none;transition:box-shadow .2s cubic-bezier(.22,1,.36,1)}
.combi-button:hover{color:var(--premio-navy);box-shadow:inset 0 0 0 1px rgba(16,32,51,.55)}
.combi-button:focus-visible{outline:2px solid var(--premio-navy);outline-offset:4px}

/* Product stage: fixed height, centered so 6/10/20-tray models share one visual center
   and grow both upward and downward from it. Height/x/y come from per-variant CSS custom
   properties (see combi-ovens.js). The extra fixed translateY(-16px) nudges every variant
   slightly closer to the panel's visual center on top of that shared per-variant baseline. */
.combi-stage{position:relative;height:min(990px,94vh);display:flex;align-items:center;justify-content:center;overflow:hidden}
.combi-stage__glow{position:absolute;left:0;right:0;top:50%;margin:auto;width:78%;height:70%;transform:translateY(-50%);border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--premio-cyan) 22%,transparent),transparent 72%);filter:blur(10px);pointer-events:none}
.combi-stage__image{position:relative;z-index:1;min-width:0;height:var(--oven-h,55%);width:auto;max-width:none;object-fit:contain;transform:translate(var(--oven-x,0%),var(--oven-y,0%)) translateY(-16px);scale:var(--oven-z,1);opacity:1;transition:height .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1),scale .45s cubic-bezier(.22,1,.36,1),opacity .28s ease}
.combi-stage__image.is-swapping{opacity:0;transform:translate(var(--oven-x,0%),var(--oven-y,0%)) translateY(-16px) scale(.97)}

@media(prefers-reduced-motion:reduce){.combi-stage__image{transition:opacity .2s ease}}

/* Cooking-modes section: one compact horizontal technology strip, not a full-height showcase.
   Reuses .combi-eyebrow, .combi-selector and .combi-pill, plus the site's alternating
   white/light-grey section background already used elsewhere (e.g. series-products). */
.combi-modes{padding:56px 0;background:var(--premio-light-grey)}
.combi-modes__intro,.combi-precision__intro,.combi-models__intro,.combi-advanced__intro,.combi-specs__intro{max-width:640px;margin-bottom:28px}
.combi-modes h2,.combi-precision h2,.combi-models h2,.combi-advanced h2,.combi-specs h2{margin:0 0 14px;font-family:"Poppins Header","Poppins",sans-serif;font-size:clamp(28px,2.8vw,38px);font-weight:500;line-height:1.1;letter-spacing:-1px;color:var(--premio-navy)}
.combi-modes__lede,.combi-precision__lede,.combi-models__lede,.combi-advanced__lede,.combi-specs__lede{margin:0 0 24px;max-width:520px;font-size:15px;line-height:1.6;color:var(--premio-grey);overflow-wrap:anywhere}

.combi-modes__stage{display:flex;flex-wrap:wrap;align-items:center;gap:28px;padding:24px 32px;background:var(--premio-white);border-top:2px solid var(--premio-cyan)}
.combi-modes__content{display:flex;flex-wrap:wrap;align-items:center;gap:24px 32px;flex:1;min-width:0}
.combi-modes__heading{flex:none;min-width:170px;transition:opacity .2s ease}
.combi-modes__tag{margin:0 0 4px;color:var(--premio-cyan);font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.combi-modes__heading h3{margin:0;font-family:"Poppins Header","Poppins",sans-serif;font-size:19px;font-weight:500;letter-spacing:-.2px;color:var(--premio-navy)}
.combi-modes__description{margin:0;flex:1 1 260px;min-width:0;font-size:14px;line-height:1.55;color:var(--premio-grey);overflow-wrap:anywhere;transition:opacity .2s ease}
.combi-modes__benefits{display:flex;flex:1 1 220px;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none;transition:opacity .2s ease}
.combi-modes__benefits li{position:relative;padding-left:14px;font-size:12px;font-weight:700;line-height:1.4;color:var(--premio-navy);white-space:nowrap}
.combi-modes__benefits li::before{content:"";position:absolute;left:0;top:6px;width:5px;height:5px;border-radius:999px;background:var(--premio-cyan)}
.combi-modes__content.is-swapping .combi-modes__heading,
.combi-modes__content.is-swapping .combi-modes__description,
.combi-modes__content.is-swapping .combi-modes__benefits{opacity:0}

@media(max-width:1199px){
	.combi-modes{padding:48px 0}
}

@media(max-width:900px){
	.combi-modes__stage{padding:22px 24px}
}

@media(max-width:767px){
	.combi-modes{padding:36px 0}
	.combi-modes__intro{margin-bottom:22px}
	.combi-modes__lede{max-width:none}
	.combi-modes__stage{flex-direction:column;align-items:flex-start;padding:22px}
	.combi-modes__content{gap:16px}
	.combi-modes__benefits{gap:8px 14px}
}

/* Precision-control section: one compact typographic strip (index + label + line), no cards.
   Shares .combi-precision__intro/h2/__lede rules with .combi-modes (see above) for consistency. */
.combi-precision{padding:56px 0;background:var(--premio-white)}
.combi-precision__grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin:0;padding:0;list-style:none;border-top:2px solid var(--premio-cyan)}
.combi-precision__grid li{padding:22px 20px;border-left:1px solid rgba(16,32,51,.12);border-bottom:2px solid transparent;transition:border-color .2s ease}
.combi-precision__grid li:first-child{border-left:0}
.combi-precision__grid li:hover{border-bottom-color:var(--premio-cyan)}
.combi-precision__index{display:block;margin:0 0 10px;color:var(--premio-cyan);font-size:11px;font-weight:700;letter-spacing:1px}
.combi-precision__grid h3{margin:0 0 8px;font-family:"Poppins Header","Poppins",sans-serif;font-size:15px;font-weight:500;letter-spacing:-.1px;color:var(--premio-navy)}
.combi-precision__grid p{margin:0;font-size:12.5px;line-height:1.5;color:var(--premio-grey);overflow-wrap:anywhere}

@media(prefers-reduced-motion:reduce){.combi-precision__grid li{transition:none}}

@media(max-width:1199px){
	.combi-precision{padding:48px 0}
	.combi-precision__grid li{padding:20px 16px}
}

@media(max-width:900px){
	.combi-precision__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
	.combi-precision__grid li:nth-child(3n+1){border-left:0}
	.combi-precision__grid li:nth-child(n+4){border-top:1px solid rgba(16,32,51,.12)}
}

@media(max-width:767px){
	.combi-precision{padding:36px 0}
	.combi-precision__intro{margin-bottom:22px}
	.combi-precision__lede{max-width:none}
	.combi-precision__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.combi-precision__grid li{padding:18px 14px}
	.combi-precision__grid li:nth-child(3n+1){border-left:1px solid rgba(16,32,51,.12)}
	.combi-precision__grid li:nth-child(2n+1){border-left:0}
	.combi-precision__grid li:nth-child(n+4){border-top:0}
	.combi-precision__grid li:nth-child(n+3){border-top:1px solid rgba(16,32,51,.12)}
}

/* Model comparison ("Koji model odgovara vašoj kuhinji?"): one shared panel, 3 columns,
   hairline separators — not three disconnected cards. Shares intro/h2/lede with the two
   sections above (see combined selectors near .combi-modes__intro). */
.combi-models{padding:56px 0;background:var(--premio-light-grey)}
.combi-models__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 24px;padding:0;list-style:none;background:var(--premio-white);border-top:2px solid var(--premio-cyan)}
.combi-models__grid li{min-width:0;padding:26px 28px;border-left:1px solid rgba(16,32,51,.12)}
.combi-models__grid li:first-child{border-left:0}
.combi-models__grid h3{margin:0 0 10px;font-family:"Poppins Header","Poppins",sans-serif;font-size:20px;font-weight:500;letter-spacing:-.2px;color:var(--premio-navy)}
.combi-models__positioning{margin:0 0 16px;font-size:13.5px;line-height:1.65;color:var(--premio-grey);min-height:70px}
.combi-models__tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:14px 0 0;list-style:none;border-top:1px solid rgba(16,32,51,.1)}
.combi-models__tags li{padding:5px 11px;border:1px solid rgba(16,32,51,.16);border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.2px;color:var(--premio-navy)}
.combi-models__tags li.is-highlighted{border-color:var(--premio-cyan);background:color-mix(in srgb,var(--premio-cyan) 16%,transparent)}
.combi-models__bestfor{margin:0;font-size:13px;line-height:1.6;color:var(--premio-grey)}
.combi-models__bestfor strong{color:var(--premio-navy);font-weight:700}
.combi-models__note{width:100%;box-sizing:border-box;margin:0;max-width:760px;font-size:12.5px;line-height:1.6;color:var(--premio-grey);overflow-wrap:anywhere}
.combi-models__note strong{color:var(--premio-navy);font-weight:700}

@media(max-width:1199px){
	.combi-models{padding:48px 0}
	.combi-models__grid li{padding:22px 20px}
	.combi-models__positioning{min-height:92px}
}

@media(max-width:900px){
	.combi-models__grid{grid-template-columns:minmax(0,1fr)}
	.combi-models__grid li{border-left:0;border-top:1px solid rgba(16,32,51,.12)}
	.combi-models__grid li:first-child{border-top:0}
	.combi-models__positioning{min-height:0}
}

@media(max-width:767px){
	.combi-models{padding:36px 0}
	.combi-models__intro{margin-bottom:22px}
	.combi-models__lede{max-width:none}
	.combi-models__grid{margin-bottom:20px}
	.combi-models__grid li{padding:20px}
}

/* Advanced functions ("Pametnije upravljanje svakim ciklusom"): compact 3x2 icon grid,
   hairline separators matching .combi-models — not a dashboard, not oversized cards. */
.combi-advanced{padding:56px 0}
.combi-advanced__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 20px;padding:0;list-style:none;border-top:2px solid var(--premio-cyan)}
.combi-advanced__grid li{min-width:0;padding:24px 26px;border-left:1px solid rgba(16,32,51,.12);border-bottom:1px solid rgba(16,32,51,.12)}
.combi-advanced__grid li:nth-child(3n+1){border-left:0}
.combi-advanced__grid li:nth-child(n+4){border-bottom:0}
.combi-advanced__icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin-bottom:12px;border-radius:8px;background:color-mix(in srgb,var(--premio-navy) 6%,transparent);color:var(--premio-navy)}
.combi-advanced__icon svg{width:18px;height:18px}
.combi-advanced__grid li:hover .combi-advanced__icon{background:color-mix(in srgb,var(--premio-cyan) 18%,transparent);color:var(--premio-navy)}
.combi-advanced__grid h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-family:"Poppins Header","Poppins",sans-serif;font-size:16px;font-weight:500;letter-spacing:-.1px;color:var(--premio-navy)}
.combi-advanced__grid p{margin:0;font-size:13px;line-height:1.55;color:var(--premio-grey)}
.combi-advanced__tag{padding:2px 8px;border:1px solid rgba(16,32,51,.16);border-radius:999px;font-size:9.5px;font-weight:700;letter-spacing:.3px;color:var(--premio-cyan);text-transform:uppercase}
.combi-advanced__note{margin:0;font-size:12.5px;line-height:1.6;color:var(--premio-grey);display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.combi-advanced__tag--inline{color:var(--premio-navy);border-color:rgba(16,32,51,.16)}

@media(max-width:1199px){
	.combi-advanced{padding:48px 0}
	.combi-advanced__grid li{padding:20px 18px}
}

@media(max-width:900px){
	.combi-advanced__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.combi-advanced__grid li:nth-child(3n+1){border-left:1px solid rgba(16,32,51,.12)}
	.combi-advanced__grid li:nth-child(2n+1){border-left:0}
	.combi-advanced__grid li:nth-child(n+4){border-bottom:1px solid rgba(16,32,51,.12)}
	.combi-advanced__grid li:nth-child(n+5){border-bottom:0}
}

@media(max-width:767px){
	.combi-advanced{padding:36px 0}
	.combi-advanced__intro{margin-bottom:22px}
	.combi-advanced__lede{max-width:none}
	.combi-advanced__grid li{padding:18px 14px}
	.combi-advanced__grid h3{font-size:15px;flex-wrap:wrap}
}

/* Technical specifications: a live-updating summary strip + 5 grouped spec blocks.
   Reuses the .combi-facts dt/dd convention (label above value) rather than a table. */
.combi-specs{padding:56px 0;background:var(--premio-light-grey)}
.combi-specs__summary{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin:0 0 28px;padding:18px 24px;background:var(--premio-white);border-left:3px solid var(--premio-cyan)}
.combi-specs__summary-model{font-family:"Poppins Header","Poppins",sans-serif;font-size:17px;font-weight:500;color:var(--premio-navy)}
.combi-specs__summary-capacity,.combi-specs__summary-control{font-size:13px;font-weight:700;color:var(--premio-grey)}
.combi-specs__summary-divider{width:1px;height:14px;background:rgba(16,32,51,.16)}
.combi-specs__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0 0 24px;background:var(--premio-white);border-top:2px solid var(--premio-cyan)}
.combi-specs__group{min-width:0;padding:28px 26px;border-left:1px solid rgba(16,32,51,.12)}
.combi-specs__group:nth-child(3n+1){border-left:0}
.combi-specs__group:nth-child(n+4){border-top:1px solid rgba(16,32,51,.12)}
.combi-specs__group h3{margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid rgba(16,32,51,.12);font-family:"Poppins Header","Poppins",sans-serif;font-size:12.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--premio-cyan)}
.combi-specs__group dl{margin:0;display:flex;flex-direction:column;gap:14px}
.combi-specs__group dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;min-width:0}
.combi-specs__group dt{margin:0;font-size:11px;font-weight:600;letter-spacing:.3px;color:var(--premio-grey);flex-shrink:1}
.combi-specs__group dd{margin:0;font-size:13.5px;font-weight:700;line-height:1.4;text-align:right;color:var(--premio-navy);overflow-wrap:anywhere}
.combi-specs__note{margin:0;font-size:12.5px;line-height:1.6;color:var(--premio-grey)}
.combi-specs__note strong{color:var(--premio-navy);font-weight:700}

@media(max-width:1199px){
	.combi-specs{padding:48px 0}
	.combi-specs__group{padding:20px 18px}
}

@media(max-width:900px){
	.combi-specs__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.combi-specs__group:nth-child(3n+1){border-left:1px solid rgba(16,32,51,.12)}
	.combi-specs__group:nth-child(2n+1){border-left:0}
	.combi-specs__group:nth-child(n+4){border-top:1px solid rgba(16,32,51,.12)}
	.combi-specs__group:nth-child(n+3){border-top:1px solid rgba(16,32,51,.12)}
}

@media(max-width:767px){
	.combi-specs{padding:36px 0}
	.combi-specs__intro{margin-bottom:22px}
	.combi-specs__lede{max-width:none}
	.combi-specs__summary{padding:14px 18px;gap:10px}
	.combi-specs__grid{grid-template-columns:minmax(0,1fr)}
	.combi-specs__group{border-left:0!important;padding:18px}
	.combi-specs__group:nth-child(n+2){border-top:1px solid rgba(16,32,51,.12)}
	.combi-specs__group dl>div{flex-wrap:wrap}
	.combi-specs__group dd{text-align:left}
}

/* Extra breathing room before the global footer — the reused .ptp-rfq/.ptp-section pattern
   applies equal top/bottom padding, which is correct on the thermal product pages but leaves
   the footer feeling too close here, so only the bottom is increased for this page. */
.combi #ponuda{padding-bottom:112px}

@media(max-width:1199px){
	.combi #ponuda{padding-bottom:92px}
}

@media(max-width:767px){
	.combi #ponuda{padding-bottom:72px}
}

@media(max-width:1199px){
	.combi-wrap{width:calc(100% - 64px)}
	.combi-hero{padding:32px 0 56px}
	.combi-hero__grid{gap:36px}
	.combi-stage{height:min(774px,90vh)}
}

@media(max-width:900px){
	.combi-wrap{width:calc(100% - 48px)}
	.combi-hero__grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"visual" "copy";gap:32px}
	.combi-hero__copy{max-width:none}
	.combi-stage{height:min(678px,72vh)}
}

@media(max-width:767px){
	.combi-wrap{width:calc(100% - 40px)}
	.combi-hero{padding:20px 0 26px}
	.combi h1{font-size:clamp(32px,9vw,40px)}
	.combi-hero__lede{font-size:15px;margin-bottom:28px}
	.combi-stage{height:min(580px,62vh,100vw)}
	.combi-facts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px}
	.combi-selector__options{width:100%;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
	.combi-selector__options::-webkit-scrollbar{display:none}
	.combi-pill{flex:0 0 auto;padding-inline:16px;white-space:nowrap}
	.combi-hero__actions{width:100%}
	.combi-button{width:100%;justify-content:center}
}