/* ENERGIK — web. Farby a písma podľa manuálu značky (rev. B). */
:root{
  --paper:#EEF1F0;
  --white:#FFFFFF;
  --desk:#E3E8E7;
  --ink:#1B2328;
  --steel:#55626A;
  --line:#D2D9D9;
  --supply:#C9481C;
  --supply-hover:#A93A14;
  --return:#2367A8;
  --brass:#8F6A22;
  --now:#B0203A;
  --plan:#B57E08;
  --ok:#2B7F52;
  --supply-light:#F2683A;
  --return-light:#5C9EE3;
  --grid:rgba(35,103,168,.08);

  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-text:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;

  --gutter:clamp(16px,4vw,40px);
  --sec:clamp(64px,9vw,120px);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--f-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3{margin:0;font-family:var(--f-display);text-wrap:balance}
p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:var(--return)}
img,svg{max-width:100%}
code,.mono{font-family:var(--f-mono);font-size:.88em}
:focus-visible{outline:2px solid var(--return);outline-offset:3px}
.wrap{max-width:1160px;margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--white);padding:10px 14px;z-index:100;text-decoration:none}
.skip:focus{top:12px}

/* zástupný text, ktorý treba pred spustením doplniť */
.ph{background:#FFF3C4;color:#6B4E00;border-bottom:1.5px dashed #B57E08;padding-inline:3px}

/* značka */
.mark{display:block;flex:none;overflow:visible}
.mark path{fill:none;stroke-width:7}
.m-s{stroke:var(--supply)}
.m-r{stroke:var(--return)}
.m-i{stroke:var(--ink)}
.m-d{fill:var(--ink)}
.mark-dark .m-s{stroke:var(--supply-light)}
.mark-dark .m-r{stroke:var(--return-light)}
.mark-dark .m-i{stroke:var(--white)}
.mark-dark .m-d{fill:var(--white)}

/* dvojica pruhov prívod / spiatočka */
.pipe{height:12px;background:linear-gradient(var(--supply) 0 50%,var(--return) 50% 100%)}

/* tlačidlá */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--supply);color:var(--white);font:600 16px/1 var(--f-text);padding:15px 22px;border:0;border-radius:4px;text-decoration:none;cursor:pointer;transition:background-color .15s}
.btn:hover{background:var(--supply-hover)}
.btn-sm{font-size:14px;padding:11px 16px}
.btn-wide{width:100%}
.btn-link{color:var(--ink);font-weight:600;text-decoration:none;padding:15px 4px}
.btn-link:hover{color:var(--supply)}

.eyebrow{font:500 12px/1.35 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--supply)}
.head{max-width:720px;margin-bottom:clamp(36px,5vw,56px)}
.head h2{margin-top:12px;font-weight:800;font-stretch:125%;font-size:clamp(28px,4.2vw,46px);line-height:1.05;letter-spacing:-.012em}
.head p:not(.eyebrow){margin-top:16px;color:var(--steel);font-size:clamp(17px,1.6vw,19px);max-width:60ch}

/* stavy reportu: farba + tvar */
.st{display:inline-block;width:11px;height:11px;flex:none;background:currentColor}
.st-now{color:var(--now)}
.st-plan{color:var(--plan);clip-path:polygon(50% 0,100% 100%,0 100%)}
.st-ok{color:var(--ok);border-radius:50%}
.st-save{color:var(--brass);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}

/* hlavička */
.hdr{position:sticky;top:0;z-index:50;background:rgba(238,241,240,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.hdr-in{display:flex;align-items:center;gap:24px;min-height:68px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-weight:800;font-stretch:125%;font-size:21px;letter-spacing:.01em}
.brand .mark{width:28px;height:30px}
.nav{display:flex;align-items:center;gap:26px;margin-left:auto;font-size:15px}
.nav a:not(.btn){color:var(--steel);text-decoration:none}
.nav a:not(.btn):hover{color:var(--ink)}
.nav-btn{display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--line);border-radius:4px;background:var(--white);cursor:pointer;place-items:center}
.nav-btn-bars,.nav-btn-bars::before,.nav-btn-bars::after{display:block;width:18px;height:2px;background:var(--ink);position:relative;transition:transform .2s}
.nav-btn-bars::before,.nav-btn-bars::after{content:"";position:absolute;left:0}
.nav-btn-bars::before{top:-6px}
.nav-btn-bars::after{top:6px}
.hdr[data-open] .nav-btn-bars{background:transparent}
.hdr[data-open] .nav-btn-bars::before{transform:translateY(6px) rotate(45deg)}
.hdr[data-open] .nav-btn-bars::after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:960px){
  .nav-btn{display:grid}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--white);border-bottom:1px solid var(--line);padding:8px var(--gutter) 20px;margin:0}
  .hdr[data-open] .nav{display:flex}
  .nav a:not(.btn){padding:14px 0;border-bottom:1px solid var(--line);color:var(--ink);font-size:17px}
  .nav .btn{margin-top:16px}
}

/* úvod */
.hero{position:relative;isolation:isolate;border-bottom:1px solid var(--line)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:24px 24px;-webkit-mask-image:linear-gradient(#000 50%,transparent);mask-image:linear-gradient(#000 50%,transparent)}
.hero-in{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(36px,6vw,80px);align-items:center;padding-block:clamp(48px,8vw,104px)}
.hero h1{margin-top:18px;font-weight:800;font-stretch:125%;font-size:clamp(38px,6.4vw,76px);line-height:.98;letter-spacing:-.018em}
.lead{margin-top:22px;font-size:clamp(17px,1.8vw,20px);color:var(--steel);max-width:54ch}
.ctas{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin-top:30px}
.proof{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:32px;font-size:15px;color:var(--steel)}
.proof li{display:flex;align-items:center;gap:8px}
.proof li::before{content:"";width:10px;height:6px;border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);transform:rotate(-45deg) translateY(-2px)}
@media (max-width:860px){.hero-in{grid-template-columns:1fr}}

/* report v úvode */
.pas-wrap{position:relative;z-index:1;max-width:440px;width:100%;justify-self:end}
@media (max-width:860px){.pas-wrap{justify-self:start}}
.pas{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--line);box-shadow:0 24px 48px -24px rgba(16,26,30,.28),0 2px 6px rgba(16,26,30,.06)}
.pas-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;border-bottom:1px solid var(--line);font-size:12px;color:var(--steel)}
.pas-brand{display:flex;align-items:center;gap:8px;font-weight:800;font-stretch:125%;font-size:15px;color:var(--ink)}
.pas-brand .mark{width:18px;height:19px}
.pas-kicker{padding:22px 22px 0;font:700 11px/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--supply)}
.pas-obj{padding:6px 22px 0;font-weight:700;font-stretch:112%;font-size:20px;line-height:1.25}
.pas-st{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border-block:1px solid var(--line);margin-top:20px}
.pas-st li{background:var(--white)}
.pas-st b{display:block;font-weight:800;font-stretch:125%;font-size:30px;line-height:1}
.pas-st span{display:flex;align-items:center;gap:7px;margin-top:6px;font-size:14px;color:var(--steel)}
.pas-save{padding:18px 22px}
.pas-save > span{display:block;font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.pas-save b{display:block;margin-top:4px;font-weight:800;font-stretch:112%;font-size:clamp(19px,5.6vw,24px);white-space:nowrap;color:var(--brass)}
.pas .pipe{height:8px}
.pas-note{padding:10px 22px 12px;font-size:12px;color:var(--steel)}

/* sekcie */
.sec{padding-block:var(--sec)}
.sec + .sec{border-top:1px solid var(--line)}

/* problém */
.sec-problem{background:var(--ink);color:var(--white);border-top:0}
.sec-problem .eyebrow{color:var(--supply-light)}
.sec-problem + .sec{border-top:0}
.pains{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14)}
.pains li{background:var(--ink);padding:24px 22px 26px;font-size:17px;line-height:1.5;color:#D5DDE0}
.pains li::before{content:"";display:block;width:24px;height:2px;background:var(--supply-light);margin-bottom:16px}
.answer{margin-top:clamp(32px,4vw,44px);font-weight:700;font-stretch:112%;font-size:clamp(20px,2.4vw,26px);line-height:1.3;max-width:40ch}
@media (max-width:960px){.pains{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pains{grid-template-columns:1fr}}

/* kroky */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,32px);counter-reset:none}
.steps li{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:3px solid var(--ink)}
.steps li:first-child{border-top-color:var(--supply)}
.steps li:last-child{border-top-color:var(--return)}
.step-no{font:700 13px/1 var(--f-mono);color:var(--steel);letter-spacing:.08em}
.steps h3{font-weight:800;font-stretch:125%;font-size:24px;line-height:1.1}
.steps p{color:var(--steel);font-size:16px}
.steps .out{margin-top:auto;padding-top:12px;color:var(--ink);font-weight:600;font-size:15px;line-height:1.4}
.steps .out span{display:block;font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel);margin-bottom:4px}
@media (max-width:960px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* report */
.sec-report{background:var(--desk)}
.legend{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 24px;margin-bottom:28px}
.legend li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:center}
.legend b{font:700 13px/1 var(--f-mono);letter-spacing:.06em}
.legend span{grid-column:2;font-size:14px;color:var(--steel);line-height:1.4;margin-top:4px}
@media (max-width:860px){.legend{grid-template-columns:repeat(2,minmax(0,1fr))}}
.doc{background:var(--white);border:1px solid var(--line);box-shadow:0 30px 60px -30px rgba(16,26,30,.3)}
.doc-head{display:flex;justify-content:space-between;gap:20px 40px;flex-wrap:wrap;padding:clamp(20px,3vw,32px);border-bottom:1.5px solid var(--ink)}
.doc-kicker{font:700 11px/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--supply)}
.doc-title{margin-top:6px;font-weight:800;font-stretch:125%;font-size:clamp(20px,2.6vw,28px);line-height:1.15}
.doc-meta{display:flex;flex-wrap:wrap;gap:12px 32px}
.doc-meta dt{font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.doc-meta dd{margin-top:4px;font-size:15px;font-weight:600}
.doc-row{display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,1.6fr) minmax(0,1.3fr);gap:16px;padding:16px clamp(20px,3vw,32px);border-bottom:1px solid var(--line);font-size:15px;align-items:baseline}
.doc-row span:first-child{display:flex;align-items:center;gap:8px;font:700 12px/1 var(--f-mono);letter-spacing:.06em;align-self:center}
.doc-row code{font-weight:700;margin-right:4px}
.doc-row-h{font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel);padding-block:12px}
.doc-row-h span:first-child{font:inherit;letter-spacing:inherit}
.doc-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;padding:clamp(20px,3vw,32px)}
.doc-foot div > span{display:block;font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.doc-foot b{display:block;margin-top:6px;font-weight:800;font-stretch:112%;font-size:clamp(24px,3vw,32px);color:var(--brass)}
.doc-foot p{font-size:13px;color:var(--steel)}
@media (max-width:760px){
  .doc-row-h{display:none}
  .doc-row{grid-template-columns:1fr;gap:6px}
  .doc-row span:nth-child(2){font-weight:600}
  .doc-row span:nth-child(4){color:var(--steel)}
}

/* pre koho */
.cells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.cells li{background:var(--white);padding:26px 24px 28px}
.tag{display:block;font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.cells h3{margin-top:12px;font-weight:700;font-stretch:112%;font-size:21px;line-height:1.2}
.cells p{margin-top:8px;color:var(--steel);font-size:16px}
@media (max-width:900px){.cells{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cells{grid-template-columns:1fr}}

/* starostlivosť */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.plan{background:var(--white);border:1px solid var(--line);padding:28px 26px 30px}
.plan h3{font-weight:800;font-stretch:125%;font-size:26px}
.plan-for{margin-top:8px;color:var(--steel);font-size:16px;min-height:3.2em}
.plan ul{display:grid;gap:10px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
.plan li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;font-size:16px;line-height:1.45}
.plan li::before{content:"";width:10px;height:6px;margin-top:.45em;border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);transform:rotate(-45deg)}
.plans-note{margin-top:24px;color:var(--steel)}
@media (max-width:900px){.plans{grid-template-columns:1fr}.plan-for{min-height:0}}

/* karta objektu */
.karta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(36px,6vw,80px);align-items:center}
.head-left{margin-bottom:28px}
.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}
.checks li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;font-size:16px;line-height:1.45}
.checks li::before{content:"";width:10px;height:6px;margin-top:.45em;border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);transform:rotate(-45deg)}
.sticker-fig{background:var(--desk);border:1px solid var(--line);padding:clamp(20px,4vw,44px)}
.sticker{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 22px rgba(10,18,22,.18))}
.sticker-fig figcaption{margin-top:16px;font-size:14px;color:var(--steel)}
.s-bg{fill:var(--white)}
.s-band{fill:var(--ink)}
.s-word{font-family:var(--f-display);font-weight:800;font-stretch:125%;font-size:30px;fill:var(--white);letter-spacing:.6px}
.s-tag{font-family:var(--f-mono);font-weight:500;font-size:13px;letter-spacing:2px;fill:#AAB5BA}
.s-lab{font-family:var(--f-mono);font-weight:500;font-size:11.5px;letter-spacing:1.5px;fill:#6B777D}
.s-val{font-family:var(--f-text);font-weight:600;font-size:20px;fill:var(--ink)}
.s-small{font-size:15px}
.s-num{font-family:var(--f-mono);font-size:18px;fill:var(--ink)}
.s-strong{font-weight:700}
.s-line{stroke:var(--line);stroke-width:1.5}
.s-phone{font-family:var(--f-mono);font-weight:700;font-size:24px;fill:var(--supply)}
.s-qr{fill:var(--ink)}
.s-url{font-family:var(--f-mono);font-size:11px;fill:#6B777D}
.s-sup{fill:var(--supply)}
.s-ret{fill:var(--return)}
.s-edge{fill:none;stroke:var(--line);stroke-width:1.5}
@media (max-width:900px){.karta{grid-template-columns:1fr}}
@media (max-width:480px){.checks{grid-template-columns:1fr}}

/* o nás */
.sec-about{background:var(--white)}
.about{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:start}
.about-head h2{margin-top:12px;font-weight:800;font-stretch:125%;font-size:clamp(28px,4.2vw,46px);line-height:1.05;letter-spacing:-.012em}
.story{display:grid;gap:20px;max-width:62ch}
.story p{color:var(--steel)}
.story .story-lead{color:var(--ink);font-size:clamp(19px,2vw,22px);line-height:1.45}
.seen{display:grid;gap:14px;padding-left:20px;border-left:4px solid;border-image:linear-gradient(var(--supply) 50%,var(--return) 50%) 1}
.seen li{color:var(--steel)}
.seen b{color:var(--ink);font-weight:700}
.story .story-end{color:var(--ink);font-weight:600;font-size:18px;line-height:1.5}
.story .story-more strong{color:var(--ink)}
.story .story-sign{font:500 12px/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--supply)}
.licenses{grid-column:1 / -1;margin-top:clamp(8px,2vw,16px);padding-top:24px;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:8px 32px}
.licenses h3{font-weight:700;font-size:18px}
@media (max-width:860px){.about{grid-template-columns:1fr}}
@media (max-width:760px){.licenses{grid-template-columns:1fr}}

/* otázky */
.faq-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,64px);align-items:start}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:20px 0;font-weight:700;font-size:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 24px/1 var(--f-mono);color:var(--supply);flex:none}
.faq details[open] summary::after{content:"−"}
.faq details p{padding-bottom:22px;color:var(--steel);max-width:60ch}
@media (max-width:860px){.faq-wrap{grid-template-columns:1fr}}

/* kontakt */
.sec-contact{background:var(--ink);color:var(--white)}
.sec-contact .eyebrow{color:var(--supply-light)}
.contact{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,6vw,80px);align-items:start}
.contact-copy h2{margin-top:12px;font-weight:800;font-stretch:125%;font-size:clamp(28px,4.2vw,46px);line-height:1.05}
.contact-copy > p{margin-top:16px;color:#C3CDD1;max-width:46ch}
.contact-dl{display:grid;gap:18px;margin-top:32px}
.contact-dl dt{font:500 11px/1.3 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#93A1A8}
.contact-dl dd{margin-top:4px;font-size:18px;font-weight:600}
.contact-dl a{color:var(--white);text-decoration:none}
.contact-dl a:hover{text-decoration:underline}
.form{background:var(--white);color:var(--ink);padding:clamp(20px,3.5vw,36px);display:grid;gap:16px}
.row{display:grid;gap:6px;min-width:0}
.row-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:520px){.row-2{grid-template-columns:1fr}}
.form label{font-size:14px;font-weight:600}
.form abbr{color:var(--supply);text-decoration:none}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--white);border:1.5px solid #B9C3C6;border-radius:4px;padding:11px 12px}
.form textarea{resize:vertical;min-height:110px}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--return);box-shadow:0 0 0 3px rgba(35,103,168,.18)}
.form [aria-invalid="true"]{border-color:var(--now)}
.form-note{font-size:13px;color:var(--steel)}
.form-status{font-size:15px;min-height:1.5em}
.form-status[data-state="ok"]{color:var(--ok);font-weight:600}
.form-status[data-state="err"]{color:var(--now)}
.form button[disabled]{opacity:.6;cursor:progress}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:900px){.contact{grid-template-columns:1fr}}

/* päta */
.ftr{background:#141A1E;color:#C3CDD1;font-size:14px}
.ftr-in{display:flex;justify-content:space-between;align-items:center;gap:16px 32px;flex-wrap:wrap;padding-block:32px}
.ftr-brand{display:flex;align-items:center;gap:12px}
.ftr-brand .mark{width:30px;height:32px}
.ftr-brand b{display:block;color:var(--white);font-weight:800;font-stretch:125%;font-size:18px}
.ftr-brand span{display:block;font:500 10px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:#93A1A8}
.ftr .pipe{height:8px}
.licenses .brands{font-weight:600;letter-spacing:.01em}
.licenses h3:nth-of-type(2){margin-top:12px}
@media (min-width:761px){.licenses h3:nth-of-type(2){margin-top:0}}

/* ── úvod: popis ukážky, ťukacie stavy, prúdiace potrubie ── */
.hero-copy{position:relative;z-index:1}
.pas-tag{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;font:500 12px/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--return)}
.pas-tag .dot{width:8px;height:8px;border-radius:50%;background:var(--return);animation:ping 2.2s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(35,103,168,.45)}70%,100%{box-shadow:0 0 0 10px rgba(35,103,168,0)}}
.pas-btn{display:block;width:100%;margin:0;padding:14px 22px;border:0;border-radius:0;background:var(--white);color:inherit;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background-color .2s}
.pas-btn:focus-visible{outline:2px solid var(--return);outline-offset:-2px}
.pas-btn[aria-pressed="true"]{background:#F3F6F8}
.pas-btn[aria-pressed="true"] b{color:var(--return)}
@media (hover:hover) and (pointer:fine){.pas-btn:hover{background:#F6F8F8}}
.pas-btn:active{background:#EDF2F5}
.pas-tip{min-height:4.4em;padding:12px 22px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.45;color:var(--steel)}
.pas-tip.is-on{color:var(--ink)}
.pas-note a{color:var(--return);text-decoration:none;font-weight:600;white-space:nowrap}
.pas .scan{position:absolute;left:0;right:0;top:-120px;height:110px;z-index:3;pointer-events:none;opacity:0;background:linear-gradient(to bottom,rgba(35,103,168,0),rgba(35,103,168,.08) 65%,rgba(35,103,168,.22));border-bottom:2px solid var(--return)}

.hero-flow{position:absolute;z-index:0;right:-70px;top:50%;width:min(560px,48vw);height:auto;transform:translateY(-50%);pointer-events:none}
.hf-track{fill:none;stroke-width:10;opacity:.12}
.hf-flow{fill:none;stroke-width:4;stroke-linecap:round;stroke-dasharray:1 27;opacity:.55;animation:hf 1.6s linear infinite}
.hf-s{stroke:var(--supply)}
.hf-r{stroke:var(--return)}
@keyframes hf{to{stroke-dashoffset:-28}}
@media (max-width:860px){.hero-flow{display:none}}

/* ── štítok, ktorý sa otočí na kartu zariadenia ── */
.flip{display:block;width:100%;perspective:1400px;-webkit-perspective:1400px;cursor:pointer;border-radius:20px;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.flip:focus-visible{outline:2px solid var(--return);outline-offset:6px}
.flip-inner{display:grid;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(calc(var(--flip,0deg) + var(--ry,0deg)));transition:transform .75s cubic-bezier(.3,.7,.2,1)}
.flip.is-tilting .flip-inner{transition:transform .15s ease-out}
.flip[aria-pressed="true"] .flip-inner{--flip:180deg}
.flip-face{grid-area:1 / 1;-webkit-backface-visibility:hidden;backface-visibility:hidden;min-width:0}
.flip-back{transform:rotateY(180deg);display:flex;flex-direction:column;overflow:hidden;background:var(--white);border:1.5px solid var(--line);border-radius:3.2% / 5%;filter:drop-shadow(0 14px 22px rgba(10,18,22,.18))}
.fb-band{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:clamp(10px,2.2vw,18px) clamp(14px,3vw,24px);background:var(--ink);color:var(--white)}
.fb-lab{font:500 clamp(10px,1.2vw,12px)/1.2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:#AAB5BA}
.fb-code{font:700 clamp(13px,1.9vw,19px)/1.2 var(--f-mono)}
.fb-list{flex:1;display:grid;align-content:center;gap:clamp(6px,1.4vw,14px);padding:clamp(10px,2.2vw,20px) clamp(14px,3vw,24px)}
.fb-list li{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:clamp(8px,1.4vw,14px);font-size:clamp(12px,1.6vw,16px);line-height:1.3}
.fb-list .st{width:clamp(9px,1.2vw,12px);height:clamp(9px,1.2vw,12px)}
.fb-date{font-family:var(--f-mono);font-weight:700;white-space:nowrap}
.fb-foot{padding:clamp(8px,1.6vw,14px) clamp(14px,3vw,24px);border-top:1px solid var(--line);font-size:clamp(11px,1.4vw,14px);color:var(--steel)}
.fig-hint{font-weight:600;color:var(--ink)}

/* ── pohyb: odkrývanie pri skrolovaní ── */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 90ms)}
.js .reveal.is-in{opacity:1;transform:none}
.steps li{position:relative;border-top:0;padding-top:23px}
.steps li::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ink);transform-origin:left center}
.steps li:first-child::before{background:var(--supply)}
.steps li:last-child::before{background:var(--return)}
.js .steps li.reveal::before{transform:scaleX(0);transition:transform .9s cubic-bezier(.2,.7,.2,1) calc(var(--i,0) * 120ms + 250ms)}
.js .steps li.reveal.is-in::before{transform:scaleX(1)}

/* karta v úvode sa „naskenuje“ */
.js .pas .pas-btn b,.js .pas .pas-btn span,.js .pas .pas-save{opacity:0}
.pas.is-in .scan{animation:scan 1.3s cubic-bezier(.45,0,.2,1) .15s both}
@keyframes scan{0%{top:-120px;opacity:1}85%{opacity:1}100%{top:100%;opacity:0}}
.pas.is-in .pas-btn b,.pas.is-in .pas-btn span{animation:pop .55s cubic-bezier(.2,.8,.25,1.15) both;animation-delay:calc(.75s + var(--i,0) * .14s)}
.pas.is-in .pas-save{animation:pop .6s cubic-bezier(.2,.8,.25,1) 1.45s both}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.pas.is-in .st-now{animation:alert 1.4s ease-in-out 2.3s 2}
@keyframes alert{50%{box-shadow:0 0 0 6px rgba(176,32,58,.2)}}

/* dotyk a tlačidlá */
.btn,.btn-link,.nav-btn{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.btn{transition:background-color .15s,transform .15s}
.btn:active{transform:scale(.97)}
.hdr{transition:box-shadow .25s}
.hdr.is-scrolled{box-shadow:0 8px 24px -16px rgba(16,26,30,.35)}
@media (hover:hover) and (pointer:fine){
  .cells li,.plan{transition:transform .25s,box-shadow .25s}
  .cells li:hover{transform:translateY(-3px);box-shadow:0 14px 28px -18px rgba(16,26,30,.35);position:relative;z-index:1}
  .plan:hover{transform:translateY(-4px);box-shadow:0 18px 36px -22px rgba(16,26,30,.35)}
}

@media (prefers-reduced-motion:reduce){
  .js .reveal,.js .pas .pas-btn b,.js .pas .pas-btn span,.js .pas .pas-save{opacity:1;transform:none;transition:none;animation:none}
  .js .steps li.reveal::before{transform:none;transition:none}
  .pas .scan,.pas-tag .dot,.hf-flow,.pas.is-in .st-now{animation:none}
  .pas .scan{display:none}
  .flip-inner,.btn{transition:none}
}
