/* YABI 2.0 v3 – Cenník. Návrh: Pricing / Hero 674:5668, Content 674:5698, Contact 674:4079 (1440); mobil 682:4053 (390). */
.c-wrap{width:100%;min-width:0;max-width:calc(var(--content) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}

/* ---------- Hero ---------- */
.c-hero__inner{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding-top:160px;padding-bottom:80px}
.c-hero__headline{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.c-hero__title{font-size:120px;line-height:120px;letter-spacing:-6px}
.c-hero__aside{width:350px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.c-hero__note img{width:123px;height:80px}

/* ---------- Obsah ---------- */
.c-content{position:relative;display:flex;flex-direction:column;gap:120px;padding-block:96px;overflow-x:clip}

/* Porovnanie balíčkov */
.cmp__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto auto;align-items:end}
.cmp__head{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:20px;padding:0 24px 32px 0}
.cmp__title{font-size:48px;--lh:48px;line-height:48px;letter-spacing:-2.16px}
.cmp__lead--mobile{display:none}
.cmp__labels{grid-column:1;grid-row:2;align-self:start}
.cmp__labels li{display:flex;align-items:center;gap:14px;height:84px;padding-right:24px;border-top:1px solid var(--ink)}
.cmp__labels img{width:20px;height:20px}
.pkg{grid-row:1/3;display:grid;grid-template-rows:subgrid;min-width:0}
.pkg--start{grid-column:2}.pkg--pro{grid-column:3}.pkg--business{grid-column:4}
.pkg__tag{position:relative;align-self:end;display:flex;flex-direction:column;align-items:flex-start;gap:28px;margin:0 8px 16px;padding:24px;border-radius:var(--r-main) 0 var(--r-main) var(--r-main);color:var(--paper)}
.pkg--start .pkg__tag{background:var(--red)}
.pkg--business .pkg__tag{background:var(--green);color:var(--ink)}
/* CTA na zelenej karte Business: hover biely text + biely obrys (modrý hover základného .btn
   by na zelenej pozadí nebol čitateľný); pozadie karty ostáva zelené. */
.pkg--business .btn:not(:disabled):hover{border-color:var(--paper);background:transparent;color:var(--paper)}
.pkg--pro .pkg__tag{margin:0;padding:32px 32px 40px;border-radius:var(--r-main) var(--r-main) 0 0;background:var(--primary)}
.pkg__flap{position:absolute;right:0;top:0;width:48px;height:48px}
/* Štvorcový roh trčal nad diagonálou záhybu – odrežeme ho ako pri .k-form */
.pkg--start .pkg__tag,.pkg--business .pkg__tag{clip-path:polygon(0 0,calc(100% - 48px) 0,100% 48px,100% 100%,0 100%)}
.pkg__chip{margin-bottom:-4px}
.pkg__name{display:flex;flex-direction:column;gap:10px;white-space:nowrap}
.pkg__title{font-size:32px;--lh:32px;line-height:32px;letter-spacing:-.8px}
.pkg__price{display:flex;flex-direction:column;gap:12px;white-space:nowrap}
.pkg__amount{font-size:64px;line-height:64px;letter-spacing:-2.56px}
.pkg__toggle{display:none}
/* dl má predvolený horný margin 1em – posúval riadky balíkov oproti popiskám */
.pkg__details,.pkg__details[hidden]{display:block;grid-row:2;align-self:start;margin-top:0}
.pkg__row{display:flex;align-items:center;height:84px;padding-inline:24px;border-top:1px solid var(--ink)}
.pkg__row dt{display:none}
.pkg__row dd{display:flex;flex-direction:column;gap:10px;margin:0}
.pkg__val{font-size:16px;--lh:24px;line-height:24px;letter-spacing:-.16px}
.pkg__row dd .t-p-sm{color:var(--ink-gray)}
.pkg--pro .pkg__details{background:var(--primary);color:var(--paper);border-radius:0 0 var(--r-main) var(--r-main)}
.pkg--pro .pkg__row{padding-inline:32px;border-top:0}
.pkg--pro .pkg__row dd .t-p-sm{color:var(--white-20)}

/* Pás Pilot */
.ticker{position:absolute;left:-62px;right:-62px;top:1252px;height:64px;transform:rotate(1.5deg);background:var(--orange);overflow:hidden;pointer-events:none}
.ticker__band{display:flex;gap:40px;height:64px;align-items:center;padding-left:24px;font-size:24px;line-height:26px;letter-spacing:-.7px;white-space:pre;width:max-content}
@media (prefers-reduced-motion:no-preference){.ticker__band{animation:c-ticker 40s linear infinite}}
@keyframes c-ticker{to{transform:translateX(-50%)}}

/* Mesačný tuning */
.tuning{display:flex;flex-direction:column;gap:48px;margin-top:56px}
.tuning__header{display:flex;align-items:flex-end;justify-content:space-between;gap:48px}
.tuning__heading{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.tuning__title{font-size:64px;line-height:64px;letter-spacing:-2.56px}
.tuning__note{width:424px}
.tuning__body{display:flex;gap:24px;align-items:stretch}
.tuning__card{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:48px;padding:40px;border-radius:var(--r-main);background:var(--red);color:var(--paper)}
.tuning__card-title{font-size:48px;--lh:48px;line-height:48px;letter-spacing:-2.16px}
.tuning__benefits{display:flex;flex-direction:column;gap:22px}
.tuning__benefits li{display:flex;align-items:center;gap:14px}
.tuning__benefits img{width:20px;height:20px}
.tuning__plan{flex:0 0 340px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;padding:40px;border-radius:var(--r-main);background:var(--paper-dark)}
.tuning__price{display:flex;flex-direction:column;gap:14px;white-space:nowrap}
.tuning__amount{font-size:96px;--lh:96px;line-height:96px;letter-spacing:-4.8px}
.tuning__price .t-p-md{color:var(--ink-gray)}
.tuning__hours{display:flex;flex-direction:column;gap:12px}
.tuning__hours img{width:262px;height:22px}
.tuning__hours .t-p-sm{color:var(--ink-gray)}

/* Pilot */
.pilot__box{position:relative;display:flex;align-items:center;gap:56px;padding:64px;border-radius:var(--r-main);background:var(--ink);color:var(--paper);overflow:hidden}
.pilot__bg{position:absolute;left:213px;top:-37px;width:847px;height:565px;max-width:none;object-fit:cover;pointer-events:none}
.pilot__copy{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:36px}
.pilot__headline{display:flex;flex-direction:column;gap:32px}
.pilot__discount{font-size:120px;line-height:96px;letter-spacing:-6px;color:var(--orange);white-space:nowrap}
.pilot__for{font-size:48px;--lh:48px;line-height:48px;letter-spacing:-2.16px}
.pilot__desc{display:flex;flex-direction:column;gap:12px;max-width:520px}
.pilot__return{display:flex;flex-direction:column;gap:14px}
.pilot__return>.t-eyebrow{color:var(--white-20)}
.pilot__pills{display:flex;flex-wrap:wrap;gap:8px}
.pilot__pills li{padding:12px 18px;border:1px solid var(--paper);border-radius:var(--r-chip)}
.pilot__prices{position:relative;flex:0 0 460px;display:flex;flex-direction:column;gap:20px}
.pilot__price{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 28px;border-radius:var(--r-main);background:var(--paper);color:var(--ink)}
.pilot__price:nth-child(1){transform:rotate(-2deg)}
.pilot__price:nth-child(2){transform:rotate(1.5deg)}
.pilot__price:nth-child(3){transform:rotate(-1deg)}
.pilot__pkg{display:flex;align-items:center;gap:10px}
.pilot__dot{width:12px;height:12px;border-radius:50%}
.pilot__dot--start{background:var(--red)}.pilot__dot--pro{background:var(--primary)}.pilot__dot--business{background:var(--green)}
.pilot__amounts{display:flex;align-items:center;gap:16px;white-space:nowrap}
.pilot__old{font-size:18px;line-height:24px;letter-spacing:-.36px;text-decoration:line-through}
.pilot__new{font-size:48px;line-height:48px;letter-spacing:-2.16px}

/* Drobné písmo */
.terms{display:flex;flex-direction:column;gap:48px}
.terms__header{display:flex;align-items:flex-end;justify-content:space-between;gap:48px}
.terms__title{font-size:64px;line-height:64px;letter-spacing:-2.56px}
.terms__note{width:424px}
.terms__grid{display:flex;flex-direction:column;gap:24px;margin:0}
.terms__row{display:flex;gap:24px}
.terms__item{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:20px;padding:32px;border-radius:var(--r-main);background:var(--paper-dark)}
.terms__item dd{margin:0}

/* ---------- 1024–1439 ---------- */
@media (max-width:1439px){
  .pkg__amount{font-size:clamp(44px,4.2vw,64px);line-height:1}
  .tuning__plan{flex-basis:280px}
  .tuning__amount{font-size:72px;line-height:72px}
  .pilot__prices{flex-basis:400px}
  .pilot__bg{left:10%}
  .ticker{top:1258px}
}
@media (max-width:1199px){
  .c-hero__title{font-size:96px;line-height:96px;letter-spacing:-4.8px}
  .pilot__box{flex-direction:column;align-items:stretch}
  .pilot__prices{flex-basis:auto;max-width:460px}
  .tuning__body{flex-wrap:wrap}
  .tuning__card{flex-basis:100%}
  .tuning__plan{flex:1 1 0}
}

/* ---------- Tablet + mobil: karty s rozbaľovaním ---------- */
@media (max-width:1023px){
  .cmp__grid{display:flex;flex-direction:column;align-items:stretch;gap:16px}
  .cmp__head{padding:0 0 16px}
  .cmp__lead--desktop{display:none}.cmp__lead--mobile{display:block}
  .cmp__labels{display:none}
  .pkg{display:block;padding:0;border-radius:var(--r-main) 0 var(--r-main) var(--r-main);overflow:hidden}
  .pkg--start{background:var(--red);color:var(--paper)}
  .pkg--pro{background:var(--primary);color:var(--paper);border-radius:var(--r-main)}
  .pkg--business{background:var(--green);color:var(--ink)}
  .pkg--start,.pkg--business{clip-path:polygon(0 0,calc(100% - 48px) 0,100% 48px,100% 100%,0 100%)}
  .pkg__tag,.pkg--pro .pkg__tag{margin:0;padding:24px 24px 20px;border-radius:0;background:none!important;gap:20px}
  .pkg__flap{width:48px;height:48px}
  .pkg__toggle{display:flex;align-items:center;justify-content:space-between;width:calc(100% - 48px);margin:0 24px;padding:20px 0;border:0;border-top:1px solid currentColor;background:none;color:inherit;font-size:16px;line-height:24px;cursor:pointer;text-align:left}
  .pkg--business .pkg__toggle{border-top-color:var(--grey-20)}
  .pkg__chevron{width:20px;height:20px;background:currentColor;-webkit-mask:url(/assets/cennik/icon-chevron-down.svg) center/contain no-repeat;mask:url(/assets/cennik/icon-chevron-down.svg) center/contain no-repeat;transition:transform .2s}
  .pkg__toggle[aria-expanded="true"] .pkg__chevron{transform:rotate(180deg)}
  .pkg__details[hidden]{display:none}
  .pkg__details,.pkg--pro .pkg__details{padding:0 24px 24px;background:none;border-radius:0;margin-top:1em}
  .pkg__row,.pkg--pro .pkg__row{flex-direction:column;align-items:flex-start;gap:8px;height:auto;padding:16px 0;border-top:1px solid rgba(255,255,255,.3)}
  .pkg--business .pkg__row{border-top-color:var(--grey-20)}
  .pkg__row dt{display:flex;align-items:center;gap:10px;opacity:.8}
  .pkg__row dt img{width:20px;height:20px;filter:brightness(0) invert(1)}
  .pkg--business .pkg__row dt img{filter:none}
  .pkg__row dd .t-p-sm,.pkg--pro .pkg__row dd .t-p-sm{color:inherit;opacity:.75}
  .ticker{position:relative;left:auto;right:auto;top:auto;margin:-60px -20px -40px;transform:rotate(-3deg)}
  .tuning{margin-top:0}
  .tuning__header,.terms__header{flex-direction:column;align-items:flex-start;gap:24px}
  .tuning__note,.terms__note{width:100%}
  .terms__row{flex-direction:column}
}
@media (max-width:767px){
  .c-hero__inner{flex-direction:column;align-items:flex-start;gap:24px;padding-top:112px;padding-bottom:40px}
  .c-hero__title{font-size:48px;line-height:48px;letter-spacing:-2.4px}
  .c-hero__aside{width:100%}
  .c-content{gap:64px;padding-block:24px 64px}
  .cmp__title{font-size:32px;line-height:36px;letter-spacing:-.8px}
  .pkg__amount{font-size:40px;line-height:40px;letter-spacing:-1.6px}
  .pkg__title{font-size:28px}
  .tuning,.terms{gap:32px}
  .tuning__title,.terms__title{font-size:32px;line-height:36px;letter-spacing:-.8px}
  .tuning__body{flex-direction:column}
  .tuning__card{padding:32px 24px;gap:32px}
  .tuning__card-title{font-size:32px;line-height:36px;letter-spacing:-.8px}
  .tuning__plan{flex:none;padding:32px 24px}
  .tuning__amount{font-size:56px;line-height:56px;letter-spacing:-2.8px}
  .tuning__hours img{width:100%;max-width:262px;height:auto}
  .pilot.c-wrap{width:100%;min-width:0}
  .pilot__box{padding:24px;gap:32px}
  .pilot__price{flex-wrap:wrap;gap:12px}
  .pilot__prices{min-width:0}
  .pilot__bg{position:relative;left:auto;top:auto;order:-1;width:calc(100% + 48px);height:auto;margin:-24px -24px 0;aspect-ratio:3/2}
  .pilot__discount{font-size:80px;line-height:72px;letter-spacing:-4px}
  .pilot__for{font-size:28px;line-height:32px;letter-spacing:-.8px}
  .pilot__headline{gap:16px}
  .pilot__copy{gap:24px}
  .pilot__pills{flex-direction:column;align-items:flex-start}
  .pilot__price{padding:16px 20px}
  .pilot__new{font-size:32px;line-height:32px}
  .terms__item{padding:24px}
}
.terms__row{margin:0}

/* ---------- EN (/en/cennik/) ----------
   EN má 10 riadkov porovnania (+ Contact form, Website copy) a dlhšie texty. Pás Pilot je v SK absolútne na pevnom top
   (pod 8 riadkami) – v EN je od 1024 px v toku za porovnaním, s rovnakým odstupom ako SK (stred pásu ~140 px pod tabuľkou,
   Mesačný tuning 176 px pod tabuľkou). Štítok Pro a popis balíčka sa môžu zalomiť (SK nowrap by pretiekol stĺpec). */
.page-cennik--en .pkg__name,.page-cennik--en .pkg__chip{white-space:normal}
@media (min-width:1024px){
  .page-cennik--en .ticker{position:relative;top:auto;left:auto;right:auto;flex:none;margin:-12px -62px -172px}
}

/* ====== Motion pass: cenove karty jemne pruzia pri hoveri ====== */
@media (min-width:1024px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .pkg__tag{transition:translate .5s cubic-bezier(.34,1.56,.64,1)}
  .pkg:hover>.pkg__tag{translate:0 -6px}
  .pkg--pro .pkg__details{box-shadow:0 -8px 0 var(--primary)}
}

.pkg__toggle{font-size:16px;line-height:24px}
/* The pilot strip participates in layout, with whitespace on both sides. */
.c-content>.ticker{position:relative;inset:auto;flex:none;margin:16px -62px}
.c-content>.tuning{margin-top:0}
@media(max-width:1023px){.c-content>.ticker{margin:16px -20px}}
/* ================================================================
   PATCH → append to the very END of css/cennik.css
   Scope: the package comparison (.cmp) on /cennik/ and /en/cennik/ only.
   Other .c-content children (tuning, pilot, terms, ticker) keep the base.css reveal.
   ================================================================ */

/* 1) Reveal: the one-shot JS reveal (site.js patch) replaces the scroll-timeline reveal of the whole
      comparison section. (0,2,0) beats base.css `.c-content>*` (0,1,0). Without JS: simply visible. */
.c-content>.cmp{animation:none}

/* 2) Headline → cards on tablet/mobile: head padding 16 + grid gap 16 = 32 → 8 + 16 = 24px,
      consistent with the home pricing on mobile. (0,2,0) beats `.cmp__head{padding:0 0 16px}`.
      Desktop unchanged: the heading shares the grid row with the cards there. */
@media (max-width:1023px){.cmp .cmp__head{padding-bottom:8px}}

/* Unchanged on purpose: desktop hover `.pkg:hover>.pkg__tag{translate:0 -6px}`, details stay still,
   accordion (.pkg__toggle / [data-accordion]) untouched. */

/* Copywriting reuses Monthly tuning cards, with the site's green accent. */
.copywriting .tuning__body{display:grid;grid-template-columns:1.5fr repeat(3,minmax(0,1fr))}
.copywriting .tuning__card{background:var(--green);color:var(--ink)}
.copywriting .tuning__plan{min-width:0;padding:32px 24px}
.copywriting .tuning__amount{font-size:64px;line-height:1.05;letter-spacing:-3.2px}
.copywriting .tuning__price{white-space:normal}
@media(max-width:1199px) and (min-width:768px){
 .copywriting .tuning__body{grid-template-columns:repeat(3,minmax(0,1fr))}
 .copywriting .tuning__card{grid-column:1/-1}
}
@media(max-width:767px){
 .copywriting .tuning__body{grid-template-columns:minmax(0,1fr)}
 .copywriting .tuning__amount{font-size:56px;letter-spacing:-2.8px}
}
