/* =========================================================
   PEPE ELEKTRO · dizajn systém v2 (RESULTY)
   ========================================================= */
:root{
  --paper:#F1F3F5; --paper-2:#E6EAEE; --paper-3:#D9DEE4;
  --ink:#15181C; --ink-2:#3A414A; --ink-3:#69727D;
  --dark:#13161A; --dark-2:#1C2025; --dark-3:#262B31;
  --cu:#E07B18; --cu-lite:#F3A24E; --cu-deep:#B45F0C;
  --cu-ghost:rgba(224,123,24,.10);
  --line:rgba(21,24,28,.14); --line-2:rgba(21,24,28,.08);
  --line-dk:rgba(241,243,245,.13);
  --ok:#2F7D4F;
  --r:3px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter',sans-serif;background:var(--paper);color:var(--ink);
  line-height:1.6;font-size:16.5px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4,.disp{font-family:'Bricolage Grotesque',sans-serif;letter-spacing:-.025em;line-height:1.04}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none}
::selection{background:var(--cu);color:#fff}
.wrap{max-width:1420px;margin:0 auto;padding-left:44px;padding-right:44px}
@media(max-width:1040px){.wrap{padding-left:32px;padding-right:32px}}
@media(max-width:560px){.wrap{padding-left:20px;padding-right:20px}}
.lbl{font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cu);display:inline-block}
.lbl.mut{color:var(--ink-3)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- HEADER ---------- */
header{position:sticky;top:0;z-index:80;background:rgba(241,243,245,.87);
  backdrop-filter:blur(16px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
header.stuck{box-shadow:0 6px 30px rgba(21,24,28,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;height:74px;gap:1.4rem}
.brand{display:flex;align-items:center;flex:none}
.brand img{height:34px;width:auto}
.nav-links{display:flex;gap:1.5rem;list-style:none;font-size:.9rem;font-weight:500}
.nav-links a{color:var(--ink-2);position:relative;padding:.35rem 0;transition:color .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1.5px;
  background:var(--cu);transition:right .35s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{right:0}
.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-links a[aria-current="page"]::after{right:0}
.nav-tel{font-family:'Space Mono',monospace;font-weight:700;font-size:.84rem;
  border:1.5px solid var(--ink);padding:.6rem 1rem;border-radius:var(--r);
  display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;flex:none;
  transition:background .2s,color .2s,transform .2s}
.nav-tel:hover{background:var(--ink);color:var(--paper);transform:translateY(-1px)}
.burger{display:none;padding:.5rem;flex:none}
.burger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;
  transition:transform .3s var(--ease),opacity .2s}
.burger.x span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.x span:nth-child(2){opacity:0}
.burger.x span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1000px){
  .nav-links{position:fixed;inset:74px 0 auto 0;background:var(--paper);flex-direction:column;
    gap:0;padding:.5rem 32px 1.6rem;border-bottom:1px solid var(--line);
    transform:translateY(-130%);transition:transform .38s var(--ease);
    box-shadow:0 24px 40px rgba(21,24,28,.1);max-height:calc(100vh - 74px);overflow:auto}
  .nav-links.open{transform:none}
  .nav-links a{padding:.95rem 0;border-bottom:1px solid var(--line-2);font-size:1.02rem;display:block}
  .nav-links a::after{display:none}
  .nav-links a[aria-current="page"]{color:var(--cu)}
  .burger{display:block;order:3}
  .nav-tel{order:2;margin-left:auto;font-size:0;gap:0;padding:.6rem}
  .nav-tel svg{width:19px;height:19px}
}

/* ---------- BUTTONS ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  font-weight:600;font-size:1rem;padding:1rem 1.7rem;border-radius:var(--r);
  border:1.5px solid transparent;position:relative;overflow:hidden;
  transition:transform .25s var(--ease),box-shadow .25s,background .2s,color .2s}
.btn svg{width:18px;height:18px;flex:none;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-pri{background:var(--cu);color:#fff;box-shadow:0 10px 26px rgba(224,123,24,.26)}
.btn-pri:hover{transform:translateY(-2px);background:var(--cu-deep);box-shadow:0 16px 34px rgba(224,123,24,.3)}
.btn-sec{border-color:var(--ink);color:var(--ink)}
.btn-sec:hover{transform:translateY(-2px);background:var(--ink);color:var(--paper)}
.btn-ghost{border-color:rgba(241,243,245,.3);color:var(--paper)}
.btn-ghost:hover{transform:translateY(-2px);border-color:var(--cu-lite);color:var(--cu-lite)}
.cta-row{display:flex;gap:1rem;flex-wrap:wrap;align-items:center}

/* ---------- SECTIONS ---------- */
section{padding:108px 0}
@media(max-width:700px){section{padding:72px 0}}
.sec-head{display:grid;grid-template-columns:196px minmax(0,1fr);
  align-items:start;margin-bottom:3.2rem}
.sec-head .lbl{grid-column:1;grid-row:1 / span 2;padding-top:.55rem}
.sec-head h2{grid-column:2;grid-row:1;
  font-size:clamp(1.75rem,3vw,2.4rem);font-weight:800;max-width:24ch}
.sec-head p{grid-column:2;grid-row:2;color:var(--ink-2);font-size:1rem;
  max-width:60ch;margin-top:.9rem}
@media(max-width:1040px){
  .sec-head{grid-template-columns:1fr;gap:.9rem;margin-bottom:2.2rem}
  .sec-head .lbl{grid-column:1;grid-row:auto;padding-top:0}
  .sec-head h2{grid-column:1;grid-row:auto}
  .sec-head p{grid-column:1;grid-row:auto;margin-top:0}
}
.band-tint{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band-dark{background:var(--dark);color:var(--paper)}
.band-dark h2,.band-dark h3{color:var(--paper)}
.band-dark p{color:#AEB7C2}
.band-dark .lbl{color:var(--cu-lite)}

/* ---------- HOME HERO ---------- */
.hero{position:relative;border-bottom:1px solid var(--line);background:var(--paper);overflow:hidden}
.bellwall{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(186px,1fr));align-content:start;
  -webkit-mask-image:radial-gradient(120% 92% at 20% 46%,rgba(0,0,0,.4) 0,rgba(0,0,0,.42) 26%,#000 64%);
  mask-image:radial-gradient(120% 92% at 20% 46%,rgba(0,0,0,.4) 0,rgba(0,0,0,.42) 26%,#000 64%)}
.bellrow{display:flex;align-items:center;justify-content:space-between;gap:.8rem;
  padding:.62rem 1.1rem;border-bottom:1px solid var(--line-2);border-right:1px solid var(--line-2)}
.bname{flex:1;font-family:'Space Mono',monospace;font-size:.68rem;letter-spacing:.06em;
  color:rgba(21,24,28,.15);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  text-transform:uppercase;border:1px solid rgba(21,24,28,.075);border-radius:2px;
  padding:.22rem .5rem;background:rgba(21,24,28,.015)}
.bbtn{width:11px;height:11px;border-radius:50%;border:1.5px solid rgba(21,24,28,.11);flex:none}
.bellrow.on .bname{color:rgba(224,123,24,.42)}
.bellrow.on .bbtn{border-color:rgba(224,123,24,.5);background:rgba(224,123,24,.14);
  animation:beacon 3.4s ease-out infinite}
@keyframes beacon{0%{box-shadow:0 0 0 0 rgba(243,162,78,.5)}70%{box-shadow:0 0 0 9px rgba(243,162,78,0)}100%{box-shadow:0 0 0 0 rgba(243,162,78,0)}}
@media(max-width:900px){
  .bellwall{opacity:.6;
    -webkit-mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.5) 10%,rgba(0,0,0,.16) 26%,rgba(0,0,0,.16) 76%,rgba(0,0,0,.5) 90%,#000 100%);
    mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.5) 10%,rgba(0,0,0,.16) 26%,rgba(0,0,0,.16) 76%,rgba(0,0,0,.5) 90%,#000 100%)}
}
.hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.32fr .68fr;
  align-items:stretch;min-height:82vh}
.hero-l{padding:78px 56px 78px 0;display:flex;flex-direction:column;justify-content:center;
  border-right:1px solid var(--line)}
.hero-tag{display:flex;align-items:center;gap:.9rem;margin-bottom:2rem;flex-wrap:wrap}
.hero-tag .yr{font-family:'Space Mono',monospace;font-weight:700;font-size:.75rem;
  letter-spacing:.16em;color:var(--ink);background:var(--cu-ghost);
  border:1px solid rgba(224,123,24,.3);padding:.35rem .6rem;border-radius:2px}
.hero h1{font-size:clamp(2.5rem,6vw,4.9rem);font-weight:800;margin-bottom:1.5rem}
.hero h1 .c{color:var(--cu)}
.hero .sub{font-size:1.16rem;color:var(--ink-2);max-width:33rem;margin-bottom:2.5rem}
.hero-r{padding:78px 0 78px 40px;display:flex;flex-direction:column;justify-content:center}
@media(max-width:960px){
  .hero-in{grid-template-columns:1fr;min-height:0}
  .hero-l{border-right:0;padding:56px 0 40px}
  .hero-r{padding:0 0 56px}
}

/* rozvádzač so žiarovkou */
.rig{background:var(--dark);border:1px solid var(--line-dk);border-radius:6px;
  position:relative;overflow:hidden}
.rig::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--line-dk) 1px,transparent 1px),
                   linear-gradient(90deg,var(--line-dk) 1px,transparent 1px);
  background-size:26px 26px;opacity:.5}
.rig-h{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;
  padding:1rem 1.2rem;border-bottom:1px solid var(--line-dk);font-family:'Space Mono',monospace;
  font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#8B94A0}
.rig-h .on{display:inline-flex;align-items:center;gap:.5rem;color:var(--cu-lite)}
.rig-h .on i{width:7px;height:7px;border-radius:50%;background:var(--cu-lite);
  animation:beacon 2.6s ease-out infinite}
.bulb-stage{position:relative;height:330px}
.glow{position:absolute;left:52%;top:46%;width:320px;height:320px;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(224,123,24,.16),rgba(224,123,24,.05) 42%,transparent 68%);
  opacity:.55;animation:breathe 6s ease-in-out infinite;pointer-events:none}
.bulb-svg{position:absolute;inset:0;width:100%;height:100%;z-index:2}
/* technický rez vchodom */
.dr-wall{fill:none;stroke:#333941;stroke-width:1.6}
.dr-frame{fill:rgba(241,243,245,.03);stroke:#525A64;stroke-width:2.2}
.dr-leaf{fill:rgba(241,243,245,.02);stroke:#5F6771;stroke-width:2}
.dr-glass{fill:rgba(224,123,24,.05);stroke:#4A525C;stroke-width:1.5}
.dr-dim{stroke:#2E343B;stroke-width:1;stroke-dasharray:3 4}
.dr-part{fill:var(--dark-2);stroke:var(--cu);stroke-width:1.8}
.dr-ico{stroke:var(--cu-lite);stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.dr-lead{stroke:rgba(224,123,24,.45);stroke-width:1;stroke-dasharray:2 3}
.dr-num{fill:var(--cu);font-family:'Space Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.08em}
.dr-lbl{fill:#8B94A0;font-family:'Space Mono',monospace;font-size:7.5px;letter-spacing:.12em}
/* kamera: snímací kužeľ */
.dr-cone{fill:url(#coneGrad);opacity:.5;transform-origin:88px 62px;animation:sweep 6s ease-in-out infinite}
@keyframes sweep{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(9deg)}}
/* čítačka: pulz pri overení */
.dr-ring{fill:none;stroke:var(--cu-lite);stroke-width:1.6;opacity:0;
  transform-origin:302px 196px;animation:auth 4s ease-out infinite}
@keyframes auth{0%{opacity:.85;transform:scale(.55)}55%{opacity:0;transform:scale(1.9)}100%{opacity:0;transform:scale(1.9)}}
/* zámok: LED červená -> zelená */
.dr-led{animation:unlock 4s steps(1,end) infinite}
@keyframes unlock{0%,45%{fill:#C4443A}46%,88%{fill:#3FA46A}89%,100%{fill:#C4443A}}
.dr-bolt{animation:boltIn 4s ease-in-out infinite}
@keyframes boltIn{0%,45%{transform:translateX(0)}55%,86%{transform:translateX(-7px)}96%,100%{transform:translateX(0)}}
/* prúd v trubke */
.trace{fill:none;stroke:rgba(224,123,24,.25);stroke-width:1.8}
.trace-live{fill:none;stroke:var(--cu);stroke-width:1.8;stroke-dasharray:4 12;animation:flow 1.1s linear infinite}
.pad{fill:var(--dark);stroke:rgba(224,123,24,.45);stroke-width:1.8}
@keyframes flow{to{stroke-dashoffset:-32}}
@keyframes breathe{0%,100%{opacity:.5}50%{opacity:.72}}
@media(prefers-reduced-motion:reduce){
  .dr-cone,.dr-ring,.dr-led,.dr-bolt{animation:none}
  .dr-ring{opacity:.4}
}
.rig-read{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line-dk)}
.rig-read div{padding:1rem 1.2rem;border-right:1px solid var(--line-dk);border-top:1px solid var(--line-dk)}
.rig-read div:nth-child(-n+2){border-top:0}
.rig-read div:nth-child(2n){border-right:0}
.rig-read .k{font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:#727B87;display:block;margin-bottom:.35rem}
.rig-read .v{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.5rem;
  color:var(--paper);line-height:1}
.rig-read .v.c{color:var(--cu-lite)}
@media(prefers-reduced-motion:reduce){
  .glow{opacity:.95;animation:none}
  .bulb-svg .fil{opacity:1;animation:none}
  .trace-live,.rig-h .on i,.bellrow.on .bbtn{animation:none}
}

/* ---------- CREDS MARQUEE ---------- */
.creds{background:var(--ink);color:var(--paper);overflow:hidden}
.creds-in{display:flex;gap:3rem;padding:1rem 0;font-family:'Space Mono',monospace;
  font-size:.78rem;letter-spacing:.1em;white-space:nowrap;animation:slide 34s linear infinite}
.creds-in span{display:inline-flex;align-items:center;gap:.9rem;color:#C2C9D2}
.creds-in b{color:var(--cu-lite);font-weight:700}
.creds-in i{width:5px;height:5px;background:var(--cu);border-radius:50%;font-style:normal;flex:none}
@keyframes slide{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.creds-in{animation:none;flex-wrap:wrap;white-space:normal}}

/* ---------- SERVICES (home) ---------- */
.svc{border-top:1px solid var(--line)}
.svc-item{display:grid;grid-template-columns:70px 1fr auto;gap:2.2rem;align-items:center;
  padding:2.5rem 0;border-bottom:1px solid var(--line);position:relative;
  transition:padding-left .35s var(--ease)}
.svc-item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;
  background:var(--cu-ghost);transition:width .35s var(--ease);z-index:-1}
.svc-item:hover{padding-left:18px}
.svc-item:hover::before{width:100%}
.svc-idx{font-family:'Space Mono',monospace;font-size:.75rem;color:var(--cu);letter-spacing:.1em}
.svc-main{display:grid;grid-template-columns:auto 1fr;gap:1.8rem;align-items:center}
.svc-ico{width:44px;height:44px;color:var(--ink);flex:none}
.svc-ico svg{width:44px;height:44px}
.svc-body h3{font-size:1.6rem;font-weight:700;margin-bottom:.45rem}
.svc-body p{color:var(--ink-2);font-size:.99rem;max-width:34rem}
.svc-go{display:inline-flex;align-items:center;gap:.6rem;font-family:'Space Mono',monospace;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cu);white-space:nowrap}
.svc-go svg{width:16px;height:16px;transition:transform .3s var(--ease)}
.svc-item:hover .svc-go svg{transform:translateX(5px)}
@media(max-width:860px){
  .svc-item{grid-template-columns:1fr;gap:1rem;padding:2rem 0}
  .svc-main{grid-template-columns:auto 1fr;gap:1.2rem}
  .svc-ico,.svc-ico svg{width:34px;height:34px}
  .svc-body h3{font-size:1.3rem}
}

/* ---------- FOTO KARTY (nízke rozlíšenie → malé, jednotné) ---------- */
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.1rem}
.shots.g3{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.shots.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.shots.g3{grid-template-columns:1fr}}
.shot{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);
  overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.shot:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(21,24,28,.11)}
.shot-img{aspect-ratio:3/2;background:var(--paper-3);overflow:hidden;position:relative}
.shot-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.shot:hover .shot-img img{transform:scale(1.06)}
.shot-cap{padding:.85rem 1rem;border-top:1px solid var(--line)}
.shot-cap b{display:block;font-size:.94rem;font-weight:600;margin-bottom:.15rem}
.shot-cap span{font-family:'Space Mono',monospace;font-size:.68rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}
.band-dark .shot{border-color:var(--line-dk);background:var(--dark-2)}
.band-dark .shot-img{background:var(--dark-3)}
.band-dark .shot-cap{border-top-color:var(--line-dk)}
.band-dark .shot-cap b{color:var(--paper)}

/* široký foto pás */
.photoband{position:relative;height:clamp(220px,32vw,380px);overflow:hidden;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--dark)}
.photoband img{width:100%;height:100%;object-fit:cover;opacity:.55}
.photoband .cap{position:absolute;inset:auto 0 0 0;padding:1.6rem 0;
  background:linear-gradient(transparent,rgba(24,22,19,.9));color:var(--paper)}
.photoband .cap .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:end}
.photoband .cap b{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.1rem,2.4vw,1.6rem);font-weight:800}
.photoband .cap span{font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cu-lite)}

/* ---------- INNER HERO ---------- */
.phero{border-bottom:1px solid var(--line);background:var(--paper-2);position:relative;overflow:hidden}
.phero-in{padding:66px 44px 62px;position:relative;z-index:1}
@media(max-width:1040px){.phero-in{padding-left:32px;padding-right:32px}}
@media(max-width:560px){.phero-in{padding-left:20px;padding-right:20px}}
.crumb{font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:1.4rem;display:flex;gap:.6rem;flex-wrap:wrap}
.crumb a:hover{color:var(--cu)}
.crumb .c{color:var(--cu)}
.phero h1{font-size:clamp(2.4rem,6.4vw,5.4rem);font-weight:800;letter-spacing:-.032em;
  line-height:1;max-width:22ch;margin-bottom:1.2rem}
.phero p{font-size:clamp(1.05rem,1.35vw,1.22rem);color:var(--ink-2);max-width:56ch}
.phero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:3rem;align-items:center}
@media(max-width:900px){.phero-grid{grid-template-columns:1fr;gap:2rem}}
.phero-fig{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.phero-fig img{width:100%;aspect-ratio:16/10;object-fit:cover}
.phero-fig figcaption{padding:.8rem 1rem;border-top:1px solid var(--line);
  font-family:'Space Mono',monospace;font-size:.68rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}

/* ---------- PROSE / SPLIT ---------- */
.split2{display:grid;grid-template-columns:1fr 1fr;gap:3.2rem;align-items:start}
.split2.narrow{grid-template-columns:1.08fr .92fr}
@media(max-width:880px){.split2,.split2.narrow{grid-template-columns:1fr;gap:2.2rem}}
.prose h2{font-size:clamp(1.7rem,3.3vw,2.35rem);font-weight:800;margin:0 0 1.1rem}
.prose h3{font-size:1.32rem;font-weight:700;margin:2rem 0 .7rem}
.prose p{color:var(--ink-2);margin-bottom:1.05rem}
.prose p:last-child{margin-bottom:0}
.band-dark .prose p{color:#AEB7C2}
.feat{list-style:none}
.feat li{position:relative;padding:.9rem 0 .9rem 2.2rem;border-top:1px solid var(--line);color:var(--ink-2)}
.feat li:first-child{border-top:0}
.feat li strong{color:var(--ink);font-weight:600}
.feat li::before{content:"";position:absolute;left:0;top:1.25rem;width:11px;height:11px;
  background:var(--cu);clip-path:polygon(55% 0,0 55%,45% 55%,30% 100%,100% 40%,55% 40%)}
.band-dark .feat li{border-top-color:var(--line-dk);color:#C8CFD8}
.band-dark .feat li strong{color:var(--paper)}
.panel{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r);padding:2.2rem}
.panel .lbl{margin-bottom:1rem}
.panel h3{font-size:1.32rem;font-weight:700;margin-bottom:.8rem}
.panel p{color:var(--ink-2)}
.band-dark .panel{background:var(--dark-2);border-color:var(--line-dk)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.4rem}
.chips span{font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.04em;
  color:var(--ink-2);border:1px solid var(--line);padding:.35rem .7rem;border-radius:2px;background:var(--paper)}
.band-dark .chips span{color:#C2C9D2;border-color:var(--line-dk);background:transparent}

/* ---------- STATS ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;background:var(--paper)}
.stat{padding:2.2rem;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat .num{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:2.7rem;
  color:var(--cu);line-height:1;letter-spacing:-.03em}
.stat p{color:var(--ink-2);margin-top:.5rem;font-size:.95rem}
.band-dark .stats{border-color:var(--line-dk);background:transparent}
.band-dark .stat{border-right-color:var(--line-dk)}
@media(max-width:740px){.stats{grid-template-columns:1fr}
  .stat{border-right:0;border-bottom:1px solid var(--line)}.stat:last-child{border-bottom:0}}

/* ---------- REFS ---------- */
.ref-item{display:grid;grid-template-columns:auto 1fr auto;gap:2.6rem;align-items:baseline;
  padding:2.4rem 0;border-top:1px solid var(--line)}
.ref-item:last-child{border-bottom:1px solid var(--line)}
.ref-n{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:3.4rem;
  color:var(--line);line-height:.8;letter-spacing:-.04em}
.ref-c .tag{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cu);display:block;margin-bottom:.5rem}
.ref-c h3{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}
.ref-c p{color:var(--ink-2);max-width:40rem}
.ref-loc{font-family:'Space Mono',monospace;font-size:.76rem;color:var(--ink-3);white-space:nowrap}
@media(max-width:860px){.ref-item{grid-template-columns:auto 1fr;gap:1.4rem}
  .ref-loc{display:none}.ref-n{font-size:2.4rem}}

/* ---------- PROCES ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr)}
.step{padding:2.2rem 1.6rem 1.6rem 0;border-top:2px solid var(--cu);margin-right:1.6rem}
.step:last-child{margin-right:0}
.step .n{font-family:'Space Mono',monospace;font-size:.74rem;color:var(--cu);margin-bottom:1rem;display:block}
.step h3{font-size:1.14rem;font-weight:700;margin-bottom:.5rem}
.step p{font-size:.92rem;color:var(--ink-2)}
@media(max-width:860px){.steps{grid-template-columns:1fr 1fr;gap:1.6rem 1.2rem}.step{margin-right:0}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq{max-width:49rem}
details{border-top:1px solid var(--line)}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;padding:1.5rem 0;font-weight:600;font-size:1.08rem;
  display:flex;justify-content:space-between;gap:1.5rem;align-items:baseline}
summary::-webkit-details-marker{display:none}
summary .q{font-family:'Space Mono',monospace;font-size:.78rem;color:var(--cu);flex:none}
summary .t{flex:1}
summary .pm{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.4rem;
  color:var(--cu);transition:transform .28s var(--ease);flex:none}
details[open] summary .pm{transform:rotate(45deg)}
details .a{padding:0 0 1.6rem 3.1rem;color:var(--ink-2);max-width:41rem}
@media(max-width:560px){details .a{padding-left:0}}

/* ---------- CTA BAND ---------- */
.ctaband{background:var(--dark);color:var(--paper);text-align:center;position:relative;overflow:hidden}
.ctaband::before{content:"";position:absolute;inset:0;
  background:radial-gradient(600px 300px at 50% 0,rgba(224,123,24,.16),transparent 70%)}
.ctaband .wrap{position:relative;z-index:1}
.ctaband h2{font-size:clamp(1.9rem,4vw,2.8rem);font-weight:800;max-width:23ch;margin:0 auto 1.2rem}
.ctaband p{color:#AEB7C2;max-width:35rem;margin:0 auto 2.2rem}
.ctaband .cta-row{justify-content:center}

/* ---------- MAPA ---------- */
.mapwrap{border:1px solid var(--line-dk);border-radius:var(--r);overflow:hidden;background:var(--dark-2)}
.map-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:1.1rem 1.4rem;border-bottom:1px solid var(--line-dk);
  font-family:'Space Mono',monospace;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:#8B94A0}
.map-h b{color:var(--paper);font-weight:700}
.map-h a{color:var(--cu-lite);display:inline-flex;align-items:center;gap:.45rem}
.map-h a:hover{text-decoration:underline}
.map-frame{position:relative;aspect-ratio:16/10;background:var(--dark-3)}
.map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.35) contrast(1.05)}
.map-foot{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-dk)}
.map-foot div{padding:.95rem 1.4rem;border-right:1px solid var(--line-dk)}
.map-foot div:last-child{border-right:0}
.map-foot .k{font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:#727B87;display:block;margin-bottom:.3rem}
.map-foot .v{color:var(--paper);font-size:.92rem}
@media(max-width:640px){.map-foot{grid-template-columns:1fr}
  .map-foot div{border-right:0;border-bottom:1px solid var(--line-dk)}
  .map-foot div:last-child{border-bottom:0}}

/* ---------- KONTAKT + FORM ---------- */
.contact{background:var(--dark);color:var(--paper)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
@media(max-width:880px){.contact-grid{grid-template-columns:1fr;gap:2.6rem}}
.contact h2{font-size:clamp(2rem,4vw,2.9rem);font-weight:800;color:var(--paper);margin:1rem 0 1.3rem}
.big-tel{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(1.9rem,4.6vw,2.8rem);color:var(--cu-lite);display:inline-block;
  margin:.4rem 0 1.8rem;letter-spacing:-.02em;transition:color .2s}
.big-tel:hover{color:var(--cu)}
.crows{display:grid}
.crow{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;
  border-top:1px solid var(--line-dk);font-size:.97rem}
.crow:last-child{border-bottom:1px solid var(--line-dk)}
.crow .k{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:#8B94A0;padding-top:.2rem;flex:none}
.crow .v{color:var(--paper);text-align:right}
.crow a.v:hover{color:var(--cu-lite)}
@media(max-width:560px){.crow{flex-direction:column;gap:.25rem}.crow .v{text-align:left}}

form.cf{background:var(--dark-2);border:1px solid var(--line-dk);border-radius:var(--r);
  padding:2.3rem;display:grid;gap:1.05rem}
@media(max-width:560px){form.cf{padding:1.6rem}}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1.05rem}
@media(max-width:520px){.f2{grid-template-columns:1fr}}
form.cf label{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:#8B94A0;display:grid;gap:.45rem}
form.cf input,form.cf textarea,form.cf select{font-family:'Inter',sans-serif;font-size:1rem;
  padding:.85rem 1rem;border-radius:2px;border:1px solid var(--line-dk);
  background:rgba(241,243,245,.05);color:var(--paper);outline:none;
  transition:border-color .2s,background .2s;width:100%}
form.cf input::placeholder,form.cf textarea::placeholder{color:#5E6772}
form.cf input:focus,form.cf textarea:focus,form.cf select:focus{
  border-color:var(--cu);background:rgba(241,243,245,.08)}
form.cf select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239c948a' stroke-width='2'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat:no-repeat;background-position:right .9rem center;background-size:17px;padding-right:2.6rem}
form.cf select option{background:var(--dark-2);color:var(--paper)}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
form.cf .btn{width:100%;margin-top:.3rem}
.fnote{font-family:'Space Mono',monospace;font-size:.7rem;color:#6C7581;text-align:center;line-height:1.5}
.fmsg{display:none;padding:.9rem 1.1rem;border-radius:2px;font-size:.93rem;line-height:1.5}
.fmsg.show{display:block}
.fmsg.ok{background:rgba(47,125,79,.14);border:1px solid rgba(47,125,79,.5);color:#9fd9b4}
.fmsg.err{background:rgba(224,60,24,.12);border:1px solid rgba(224,60,24,.45);color:#f0a894}
form.cf.sending .btn{opacity:.6;pointer-events:none}

/* ---------- FOOTER ---------- */
footer{background:#0E1114;color:#79828E;padding:3.2rem 0 2.2rem}
.foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2.2rem;
  padding-bottom:2.2rem;border-bottom:1px solid var(--line-dk);margin-bottom:1.6rem}
.foot-top h4{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:#C2C9D2;margin-bottom:1rem;font-weight:700}
.foot-top a,.foot-top p{display:block;color:#79828E;font-size:.92rem;padding:.25rem 0}
.foot-top a:hover{color:var(--cu-lite)}
.foot-bar{display:flex;justify-content:space-between;gap:1.4rem;flex-wrap:wrap;
  font-family:'Space Mono',monospace;font-size:.73rem;letter-spacing:.03em;line-height:1.7}
.foot-bar a{color:#A7B0BB;border-bottom:1px solid rgba(224,123,24,.4);padding-bottom:1px}
.foot-bar a:hover{color:var(--cu-lite);border-bottom-color:var(--cu-lite)}
footer b{color:var(--paper);font-weight:700}
@media(max-width:760px){.foot-top{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-top{grid-template-columns:1fr;gap:1.6rem}}

/* ---------- MOTION ---------- */
.reveal{opacity:0;transform:translateY(24px);
  transition:opacity .75s var(--ease),transform .75s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* =========================================================
   v3 — vlastné sekcie namiesto šablónových
   ========================================================= */

/* ---------- HERO PODSTRÁNOK s vizuálnym zariadením ---------- */
.phero.dev{background:var(--dark);color:var(--paper);border-bottom:0;position:relative;overflow:hidden}
.phero.dev::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--line-dk) 1px,transparent 1px),
                   linear-gradient(90deg,var(--line-dk) 1px,transparent 1px);
  background-size:34px 34px;opacity:.45;
  -webkit-mask-image:radial-gradient(90% 80% at 70% 40%,#000,transparent 75%);
  mask-image:radial-gradient(90% 80% at 70% 40%,#000,transparent 75%)}
.phero.dev .crumb{color:#8B94A0}
.phero.dev .crumb a:hover{color:var(--cu-lite)}
.phero.dev h1{color:var(--paper)}
.phero.dev p{color:#AEB7C2}
.dev-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:3.4rem;align-items:center}
@media(max-width:940px){.dev-grid{grid-template-columns:1fr;gap:2.4rem}}
.dev-stage{position:relative;border:1px solid var(--line-dk);border-radius:4px;
  background:var(--dark-2);overflow:hidden}
.dev-stage-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.75rem 1rem;border-bottom:1px solid var(--line-dk);
  font-family:'Space Mono',monospace;font-size:.63rem;letter-spacing:.16em;
  text-transform:uppercase;color:#8B94A0}
.dev-stage-h .rec{display:inline-flex;align-items:center;gap:.45rem;color:var(--cu-lite)}
.dev-stage-h .rec i{width:6px;height:6px;border-radius:50%;background:#C4443A;
  animation:recblink 1.6s steps(1,end) infinite}
@keyframes recblink{0%,55%{opacity:1}56%,100%{opacity:.15}}
.dev-body{position:relative;aspect-ratio:4/3}
.dev-body.portrait{aspect-ratio:1/1.06}
.dev-body svg{position:absolute;inset:0;width:100%;height:100%}
.dev-foot{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-dk)}
.dev-foot div{padding:.7rem 1rem;border-right:1px solid var(--line-dk)}
.dev-foot div:last-child{border-right:0}
.dev-foot .k{display:block;font-family:'Space Mono',monospace;font-size:.58rem;
  letter-spacing:.14em;text-transform:uppercase;color:#727B87;margin-bottom:.2rem}
.dev-foot .v{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:1.02rem;color:var(--paper)}
.dev-foot .v.c{color:var(--cu-lite)}

/* kamerový hľadáčik */
.vf-crop{stroke:var(--cu-lite);stroke-width:2.6;fill:none}
.vf-scene{stroke:#7E8A97;stroke-width:2.6;fill:none}
.vf-fig{fill:#8C96A2;stroke:none}
.vf-fill{fill:rgba(241,243,245,.075)}
.vf-target{stroke:var(--cu);stroke-width:3.2;fill:none;
  animation:vfLock 5s ease-in-out infinite}
@keyframes vfLock{0%,12%{opacity:0;transform:translate(6px,4px) scale(1.1)}
  22%,72%{opacity:1;transform:none}86%,100%{opacity:0;transform:translate(-5px,3px) scale(1.05)}}
.vf-txt{fill:#8A94A0;font-family:'Space Mono',monospace;font-size:8px;letter-spacing:.1em}
.vf-scan{stroke:rgba(224,123,24,.6);stroke-width:1.6;animation:vfScan 5s linear infinite}
@keyframes vfScan{0%{transform:translateY(0)}100%{transform:translateY(210px)}}

/* čipová autentifikácia */
.ch-plate{fill:var(--dark-3);stroke:#4A525C;stroke-width:1.6}
.ch-read{fill:none;stroke:var(--cu);stroke-width:2}
.ch-wave{fill:none;stroke:var(--cu-lite);stroke-width:1.6;opacity:0;
  transform-origin:center;animation:chWave 3.6s ease-out infinite}
.ch-wave:nth-of-type(2){animation-delay:.22s}
.ch-wave:nth-of-type(3){animation-delay:.44s}
@keyframes chWave{0%{opacity:.9;transform:scale(.4)}70%{opacity:0;transform:scale(1.9)}100%{opacity:0;transform:scale(1.9)}}
.ch-chip{fill:var(--dark-2);stroke:var(--cu-lite);stroke-width:1.6;
  animation:chMove 3.6s ease-in-out infinite}
@keyframes chMove{0%{transform:translate(34px,26px)}30%,62%{transform:none}100%{transform:translate(30px,20px)}}
.ch-row{stroke:#39414A;stroke-width:1.4;fill:none}
.ch-ok{fill:#3FA46A;opacity:0;animation:chOk 3.6s steps(1,end) infinite}
@keyframes chOk{0%,32%{opacity:0}34%,70%{opacity:1}72%,100%{opacity:0}}
.ch-txt{fill:#8B94A0;font-family:'Space Mono',monospace;font-size:8px;letter-spacing:.12em}

/* zvončekový panel v hero */
.bp-plate{fill:var(--dark-3);stroke:#4A525C;stroke-width:1.6}
.bp-slot{fill:rgba(241,243,245,.05);stroke:#39414A;stroke-width:1}
.bp-btn{fill:var(--dark-2);stroke:#5F6771;stroke-width:1.2}
.bp-btn.live{stroke:var(--cu);fill:rgba(224,123,24,.18);animation:bpRing 4.2s ease-out infinite}
@keyframes bpRing{0%,72%{opacity:.5}80%{opacity:1}88%,100%{opacity:.5}}
.bp-txt{fill:#69727D;font-family:'Space Mono',monospace;font-size:6.5px;letter-spacing:.06em}

/* schéma rozvodu */
.sc-line{stroke:#3A424C;stroke-width:1.6;fill:none}
.sc-live{stroke:var(--cu);stroke-width:1.8;fill:none;stroke-dasharray:5 11;
  animation:flow 1.2s linear infinite}
.sc-box{fill:var(--dark-3);stroke:var(--cu);stroke-width:1.6}
.sc-sw{stroke:var(--cu-lite);stroke-width:1.8;stroke-linecap:round;fill:none}
.sc-txt{fill:#8B94A0;font-family:'Space Mono',monospace;font-size:7.5px;letter-spacing:.1em}

/* ---------- DENNÍK ZÁSAHOV (nahrádza generické realizácie) ---------- */
.log{border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--paper)}
.log-h{display:grid;grid-template-columns:104px 1fr 172px 128px;gap:1rem;
  padding:.8rem 1.3rem;background:var(--paper-2);border-bottom:1px solid var(--line);
  font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3)}
.log-row{display:grid;grid-template-columns:104px 1fr 172px 128px;gap:1rem;
  padding:1.15rem 1.3rem;border-bottom:1px solid var(--line-2);align-items:baseline;
  transition:background .25s var(--ease)}
.log-row:last-child{border-bottom:0}
.log-row:hover{background:var(--cu-ghost)}
.log-id{font-family:'Space Mono',monospace;font-size:.74rem;color:var(--cu);letter-spacing:.06em}
.log-what b{display:block;font-size:1.06rem;font-weight:700;font-family:'Bricolage Grotesque',sans-serif;
  letter-spacing:-.015em;margin-bottom:.25rem}
.log-what span{font-size:.92rem;color:var(--ink-2)}
.log-where{font-family:'Space Mono',monospace;font-size:.76rem;color:var(--ink-2)}
.log-tag{justify-self:start;font-family:'Space Mono',monospace;font-size:.62rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);
  border:1px solid var(--line);border-radius:2px;padding:.28rem .55rem;white-space:nowrap}
@media(max-width:900px){
  .log-h{display:none}
  .log-row{grid-template-columns:1fr;gap:.45rem;padding:1.2rem}
  .log-tag{justify-self:start}
}

/* ---------- KOMIKSY ---------- */
.comics{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
@media(max-width:900px){.comics{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.comics{grid-template-columns:1fr}}
.comic{border:1px solid var(--line-dk);border-radius:4px;overflow:hidden;background:var(--dark-2);
  transition:transform .35s var(--ease),box-shadow .35s}
.comic:hover{transform:translateY(-5px) rotate(-.4deg);box-shadow:0 20px 44px rgba(0,0,0,.34)}
.comic img{width:100%;height:auto;display:block;background:#1C2025}
.comic figcaption{padding:.85rem 1.05rem;border-top:1px solid var(--line-dk);
  display:flex;justify-content:space-between;gap:.8rem;align-items:baseline}
.comic figcaption b{font-size:.96rem;color:var(--paper);font-weight:600}
.comic figcaption span{font-family:'Space Mono',monospace;font-size:.62rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--cu-lite);white-space:nowrap}

/* ---------- ČLÁNKY ---------- */
.arts{border-top:1px solid var(--line)}
.art{display:grid;grid-template-columns:132px 1fr auto;gap:1.8rem;align-items:baseline;
  padding:1.6rem 0;border-bottom:1px solid var(--line);transition:padding-left .3s var(--ease)}
.art:hover{padding-left:12px}
.art .cat{font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cu)}
.art h3{font-size:1.2rem;font-weight:700;margin-bottom:.3rem}
.art p{font-size:.95rem;color:var(--ink-2);max-width:46rem}
.art .go{font-family:'Space Mono',monospace;font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.art:hover .go{color:var(--cu)}
@media(max-width:820px){.art{grid-template-columns:1fr;gap:.5rem}.art .go{display:none}}

/* ---------- POROVNÁVACÍ PÁS ---------- */
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:stretch;
  border:1px solid var(--line-dk);border-radius:4px;overflow:hidden}
.vs-side{padding:2.2rem}
.vs-side.bad{background:rgba(196,68,58,.06)}
.vs-side.good{background:rgba(63,164,106,.07)}
.vs-mid{width:1px;background:var(--line-dk)}
.vs-side .lbl{margin-bottom:1rem}
.vs-side.bad .lbl{color:#D98079}
.vs-side.good .lbl{color:#67C08D}
.vs-side h3{font-size:1.3rem;font-weight:700;margin-bottom:1rem;color:var(--paper)}
.vs-side ul{list-style:none}
.vs-side li{position:relative;padding:.5rem 0 .5rem 1.6rem;color:#AEB7C2;font-size:.95rem;
  border-top:1px solid var(--line-dk)}
.vs-side li:first-child{border-top:0}
.vs-side li::before{position:absolute;left:0;top:.5rem;font-family:'Space Mono',monospace;font-size:.9rem}
.vs-side.bad li::before{content:"×";color:#D98079}
.vs-side.good li::before{content:"✓";color:#67C08D}
@media(max-width:820px){.vs{grid-template-columns:1fr}.vs-mid{width:auto;height:1px}}

/* ---------- SPÍNAČ: proces ako el. obvod ---------- */
.circuit{position:relative;padding:1rem 0 0}
.circuit-rail{position:absolute;left:0;right:0;top:56px;height:2px;
  background:repeating-linear-gradient(90deg,var(--cu) 0 7px,transparent 7px 19px);opacity:.5}
.circuit-steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}
.cstep{position:relative;padding-top:104px}
.cnode{position:absolute;top:32px;left:0;width:50px;height:50px;border-radius:50%;
  background:var(--paper);border:2px solid var(--cu);display:grid;place-items:center;
  font-family:'Space Mono',monospace;font-weight:700;font-size:.86rem;color:var(--cu);
  transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.cstep:hover .cnode{background:var(--cu);color:#fff;transform:scale(1.08)}
.band-dark .cnode{background:var(--dark)}
.cstep h3{font-size:1.14rem;font-weight:700;margin-bottom:.5rem}
.cstep p{font-size:.93rem;color:var(--ink-2)}
.band-dark .cstep p{color:#AEB7C2}
.cstep .meta{display:block;font-family:'Space Mono',monospace;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-top:.7rem}
@media(max-width:900px){
  .circuit-rail{display:none}
  .circuit-steps{grid-template-columns:1fr 1fr;gap:2rem 1.4rem}
  .cstep{padding-top:0;padding-left:66px;min-height:56px}
  .cnode{top:0;left:0}
}
@media(max-width:560px){.circuit-steps{grid-template-columns:1fr}}

/* =========================================================
   v4 — hero kompozície, každá stránka iná
   ========================================================= */

/* A) CELOPLOŠNÝ HĽADÁČIK: text je súčasťou obrazu (kamery) */
.phero.full{background:var(--dark);color:var(--paper);border-bottom:0;position:relative;
  overflow:hidden;padding:0;min-height:86vh;display:flex;align-items:flex-end}
.phero.full .vfbg{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.phero.full .wrap{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:52px}
.phero.full::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(19,22,26,.55) 0%,rgba(19,22,26,.04) 22%,rgba(19,22,26,.08) 46%,rgba(19,22,26,.72) 78%,rgba(19,22,26,.95) 96%)}
.phero.full h1{color:var(--paper);max-width:20ch;font-size:clamp(2.4rem,6.2vw,5rem)}
.phero.full p{color:#C8CFD8;max-width:38rem;margin-top:1.1rem}
.phero.full .crumb{color:#9AA3AE}
.osd{position:absolute;z-index:2;font-family:'Space Mono',monospace;font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:#B6BFC9}
.osd.tl{top:98px;left:32px}.osd.tr{top:98px;right:32px;text-align:right}
.osd.br{bottom:22px;right:32px}
.osd .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#C4443A;
  margin-right:.5rem;animation:recblink 1.6s steps(1,end) infinite}
@media(max-width:640px){.osd.tl,.osd.tr{top:88px;left:20px;right:auto;text-align:left}
  .osd.tr{top:106px}.osd.br{display:none}.phero.full .wrap{padding-top:150px}}

/* B) ŠTÍTOK: hero ako typový štítok zariadenia (o nás) */
.plate{border:1px solid var(--line-dk);border-radius:4px;background:var(--dark-2);overflow:hidden;
  font-family:'Space Mono',monospace}
.plate-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:.9rem 1.3rem;background:rgba(224,123,24,.1);border-bottom:1px solid var(--line-dk);
  font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--cu-lite)}
.plate-rows{display:grid;grid-template-columns:1fr 1fr}
.plate-rows>div{padding:1.05rem 1.3rem;border-right:1px solid var(--line-dk);
  border-top:1px solid var(--line-dk)}
.plate-rows>div:nth-child(-n+2){border-top:0}
.plate-rows>div:nth-child(2n){border-right:0}
.plate-rows .k{display:block;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  color:#727B87;margin-bottom:.35rem}
.plate-rows .v{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.16rem;
  color:var(--paper);letter-spacing:-.01em}
.plate-rows .v.c{color:var(--cu-lite)}
.plate-foot{padding:.85rem 1.3rem;border-top:1px solid var(--line-dk);font-size:.62rem;
  letter-spacing:.12em;color:#727B87;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
@media(max-width:560px){.plate-rows{grid-template-columns:1fr}
  .plate-rows>div{border-right:0;border-top:1px solid var(--line-dk)}
  .plate-rows>div:first-child{border-top:0}}

/* C) PÁS: text hore, široké zariadenie na plnú šírku pod ním (prístupové) */
.phero.strip{background:var(--dark);color:var(--paper);border-bottom:0;padding:0;overflow:hidden}
.phero.strip .head{padding-top:96px;padding-bottom:44px}
.phero.strip h1{color:var(--paper);max-width:19ch}
.phero.strip p{color:#AEB7C2;max-width:40rem}
.phero.strip .crumb{color:#8B94A0}
.flowband{border-top:1px solid var(--line-dk);background:var(--dark-2);position:relative}
.flowband svg{display:block;width:100%;height:clamp(180px,22vw,260px)}
.flowband-foot{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dk)}
.flowband-foot div{padding:.9rem 1.2rem;border-right:1px solid var(--line-dk)}
.flowband-foot div:last-child{border-right:0}
.flowband-foot .k{display:block;font-family:'Space Mono',monospace;font-size:.58rem;
  letter-spacing:.15em;text-transform:uppercase;color:#727B87;margin-bottom:.25rem}
.flowband-foot .v{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1rem;color:var(--paper)}
.flowband-foot .v.c{color:var(--cu-lite)}
@media(max-width:720px){.flowband-foot{grid-template-columns:1fr 1fr}
  .flowband-foot div:nth-child(2n){border-right:0}
  .flowband-foot div:nth-child(n+3){border-top:1px solid var(--line-dk)}}

/* D) ZRKADLO: zariadenie vľavo, text vpravo (zvončeky) */
.dev-grid.mirror{grid-template-columns:1.02fr .98fr}
.dev-grid.mirror .dev-stage{order:-1}
@media(max-width:940px){.dev-grid.mirror{grid-template-columns:1fr}
  .dev-grid.mirror .dev-stage{order:1}}

/* E) PODLOŽENÝ: schéma ako pás pod textom (elektro) */
.phero.under{background:var(--dark);color:var(--paper);border-bottom:0;padding:0;overflow:hidden}
.phero.under .head{padding-top:96px;padding-bottom:40px}
.phero.under h1{color:var(--paper);max-width:20ch}
.phero.under p{color:#AEB7C2;max-width:40rem}
.phero.under .crumb{color:#8B94A0}
.schemaband{border-top:1px solid var(--line-dk);background:var(--dark-2)}
.schemaband svg{display:block;width:100%;height:clamp(170px,20vw,240px)}

/* ---------- SÚVISIACE SLUŽBY (vnútorné prelinkovanie) ---------- */
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
@media(max-width:860px){.rel{grid-template-columns:1fr}}
.rel a{display:block;padding:1.5rem 1.6rem;border:1px solid var(--line);border-radius:var(--r);
  background:var(--paper);transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.rel a:hover{transform:translateY(-4px);border-color:var(--cu);box-shadow:0 14px 32px rgba(21,24,28,.09)}
.rel .k{display:block;font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--cu);margin-bottom:.6rem}
.rel b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.14rem;
  letter-spacing:-.015em;margin-bottom:.35rem}
.rel p{font-size:.92rem;color:var(--ink-2)}

/* ---------- PORUCHOVÝ LIST: web usporiadaný podľa problémov ---------- */
.fault{border-top:1px solid var(--line)}
.frow{display:grid;grid-template-columns:44px 1.05fr 1.25fr auto;gap:2rem;align-items:center;
  padding:1.9rem 0;border-bottom:1px solid var(--line);position:relative;
  transition:padding-left .35s var(--ease),background .3s}
.frow::before{content:"";position:absolute;left:-16px;right:-16px;top:0;bottom:0;
  background:var(--cu-ghost);opacity:0;transition:opacity .3s;border-radius:2px}
.frow:hover{padding-left:14px}
.frow:hover::before{opacity:1}
.frow>*{position:relative}
.fcode{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.1em;color:var(--cu)}
.fsym{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.32rem;
  letter-spacing:-.018em;line-height:1.2}
.fdiag{color:var(--ink-2);font-size:.97rem}
.fdiag b{color:var(--ink);font-weight:600}
.ffix{display:inline-flex;align-items:center;gap:.55rem;white-space:nowrap;
  font-family:'Space Mono',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);border:1px solid var(--line);border-radius:2px;padding:.5rem .8rem;
  transition:color .25s,border-color .25s,background .25s}
.frow:hover .ffix{color:var(--cu);border-color:var(--cu);background:var(--paper)}
.ffix svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.frow:hover .ffix svg{transform:translateX(4px)}
@media(max-width:1000px){
  .frow{grid-template-columns:40px 1fr;gap:.5rem 1.2rem;padding:1.6rem 0}
  .fdiag{grid-column:2}
  .ffix{grid-column:2;justify-self:start;margin-top:.5rem}
}

/* =========================================================
   v5 · REZ BYTOVÝM DOMOM
   Zvislá šachta vľavo prechádza celou stránkou. Obsah nie je
   centrovaný, sedí vpravo od šachty. Každé podlažie má vlastnú
   kompozíciu, nie opakovaný blok label + H2 + odsek.
   ========================================================= */
.bldg{
  --pad:44px; --rail:196px; --shaft-x:140px; --shaft-w:30px; --mark-w:118px;
  position:relative;max-width:1420px;margin:0 auto;padding:0 var(--pad);
}
.shaft{position:absolute;top:0;bottom:0;left:calc(var(--pad) + var(--shaft-x));
  width:var(--shaft-w);pointer-events:none}
.shaft::before,.shaft::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--line)}
.shaft::before{left:0}
.shaft::after{right:0}
.shaft i{position:absolute;left:50%;top:0;bottom:0;width:1px;margin-left:-.5px;
  background:repeating-linear-gradient(to bottom,var(--cu) 0 8px,transparent 8px 18px);opacity:.45}

.floor{position:relative;padding:104px 0 108px}
.floor + .floor{border-top:1px solid var(--line)}
.floor + .floor::after{content:"";position:absolute;top:-6px;
  left:calc(var(--shaft-x) + var(--shaft-w)/2 - 6px);
  width:12px;height:12px;border-radius:50%;background:var(--paper);
  border:1px solid var(--ink-3)}
.fl-in{margin-left:var(--rail)}

.fl-mark{position:absolute;left:0;top:104px;width:var(--mark-w);text-align:right;
  font-family:'Space Mono',monospace;line-height:1.35}
.fl-no{display:block;font-size:1.5rem;font-weight:700;color:var(--cu);letter-spacing:-.02em}
.fl-nm{display:block;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-2);margin-top:.35rem}
.fl-lvl{display:block;font-size:.66rem;letter-spacing:.1em;color:var(--ink-3);margin-top:.5rem;
  padding-top:.5rem;border-top:1px solid var(--line)}

/* nadpis podlažia — bez opakovaného eyebrow bloku */
.fl-h{font-size:clamp(1.9rem,3.4vw,2.75rem);font-weight:800;max-width:20ch;margin-bottom:1rem}
.fl-lead{font-size:1.06rem;color:var(--ink-2);max-width:56ch}

/* symptóm → riešenie, dvojriadok bez rámčeka */
.sym{margin-top:2.6rem;display:grid;gap:1.5rem}
.sym-row{display:grid;grid-template-columns:1.5rem 1fr;gap:1.1rem;align-items:start}
.sym-row .x{font-family:'Space Mono',monospace;font-size:.85rem;color:var(--cu);
  line-height:1.5;padding-top:.15rem}
.sym-row b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:1.14rem;
  font-weight:700;letter-spacing:-.02em;margin-bottom:.3rem}
.sym-row span{display:block;color:var(--ink-2);font-size:.97rem;max-width:62ch}

/* odkaz na službu, textový nie tlačidlový */
.fl-go{display:inline-flex;align-items:center;gap:.55rem;margin-top:2.4rem;
  font-family:'Space Mono',monospace;font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--cu);
  padding-bottom:.35rem;transition:gap .25s var(--ease),color .2s}
.fl-go svg{width:15px;height:15px;transition:transform .25s var(--ease)}
.fl-go:hover{color:var(--cu)}
.fl-go:hover svg{transform:translateX(4px)}

/* --- podlažie 01 · vchod: diagram vedľa textu, ale na šírku --- */
.fl-door{margin-top:3rem;background:var(--dark);border-radius:var(--r);
  border:1px solid var(--line-dk);padding:1.6rem 1.8rem 1.2rem;overflow:hidden}
.fl-door .dh{display:flex;justify-content:space-between;align-items:center;
  font-family:'Space Mono',monospace;font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(241,243,245,.5);margin-bottom:.4rem}
.fl-door .dh .on{display:flex;align-items:center;gap:.45rem;color:var(--cu-lite)}
.fl-door .dh .on i{width:6px;height:6px;border-radius:50%;background:var(--cu);
  animation:pulseDot 2.4s infinite}
.fl-door svg{width:100%;height:auto;max-height:300px}

/* --- podlažie 02 · suterén: tmavý, pod zemou --- */
.underzone{background:var(--dark);color:#F1F3F5}
.underzone .shaft::before,.underzone .shaft::after{background:var(--line-dk)}
.floor.node::after{content:"";position:absolute;top:-6px;
  left:calc(var(--shaft-x) + var(--shaft-w)/2 - 6px);
  width:12px;height:12px;border-radius:50%;background:var(--dark);
  border:1px solid rgba(241,243,245,.4)}
.floor.under + .floor{border-top:0}
.floor.under .fl-nm{color:rgba(241,243,245,.62)}
.floor.under .fl-lvl{color:rgba(241,243,245,.42);border-top-color:var(--line-dk)}
.floor.under .fl-lead,.floor.under .sym-row span{color:rgba(241,243,245,.72)}
.floor.under .fl-go{color:#F1F3F5}
.floor.under .fl-go:hover{color:var(--cu-lite)}
/* kamerová stena — nízke rozlíšenie tu pôsobí ako reálny záber */
.cctv{margin-top:2.8rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cam{position:relative;overflow:hidden;border:1px solid var(--line-dk);border-radius:2px;
  background:#0B0D10;aspect-ratio:3/2}
.cam img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(.45) contrast(1.14) brightness(.86)}
.cam .osd{position:absolute;inset:0;padding:.75rem .85rem;display:flex;
  flex-direction:column;justify-content:space-between;
  font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(241,243,245,.88);
  text-shadow:0 1px 3px rgba(0,0,0,.85);pointer-events:none}
.cam .osd .r{display:flex;justify-content:space-between;align-items:center}
.cam .rec{display:flex;align-items:center;gap:.4rem;color:var(--cu-lite)}
.cam .rec i{width:6px;height:6px;border-radius:50%;background:var(--cu);
  animation:pulseDot 2.4s infinite}
.cam.info{display:flex;flex-direction:column;justify-content:center;gap:.75rem;
  padding:1.3rem;background:var(--dark-2);aspect-ratio:auto}
.cam.info b{font-family:'Space Mono',monospace;font-size:.64rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--cu-lite);font-weight:400}
.cam.info span{font-size:.88rem;color:rgba(241,243,245,.66);line-height:1.5}
@media(max-width:900px){.cctv{grid-template-columns:1fr 1fr}.cam.info{grid-column:1/-1}}
@media(max-width:520px){.cctv{grid-template-columns:1fr}}

/* --- podlažie 03 · byty: mini elevácia poschodí --- */
.flats{margin-top:2.8rem;border-top:1px solid var(--line);max-width:920px}
.flat{display:grid;grid-template-columns:66px 1fr auto;gap:1.6rem;align-items:center;
  padding:1.15rem 0;border-bottom:1px solid var(--line-2)}
.flat .lv{font-family:'Space Mono',monospace;font-size:.74rem;color:var(--ink-3);
  letter-spacing:.08em}
.flat .wt{font-weight:600;font-size:1rem}
.flat .wt em{font-style:normal;color:var(--ink-3);font-weight:400;display:block;
  font-size:.92rem;margin-top:.15rem}
.flat .st{font-family:'Space Mono',monospace;font-size:.66rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--cu);white-space:nowrap}

/* --- podlažie 04 · stúpačky: technická tabuľka --- */
.spec{margin-top:2.8rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 3rem;max-width:920px}
.spec dl{border-top:1px solid var(--line);padding:1.05rem 0;display:grid;
  grid-template-columns:1fr auto;gap:1rem;align-items:baseline;margin:0}
.spec dt{font-size:.98rem;font-weight:600}
.spec dd{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);margin:0;text-align:right}

@media(max-width:1040px){
  .bldg{--rail:0px;--pad:32px}
  .shaft{display:none}
  .floor{padding:64px 0 68px}
  .floor + .floor::after{display:none}
  .fl-in{margin-left:0}
  .fl-mark{position:static;width:auto;text-align:left;display:flex;align-items:baseline;
    gap:.8rem;margin-bottom:1.5rem;flex-wrap:wrap}
  .fl-no{font-size:1.05rem}
  .fl-nm{margin-top:0}
  .fl-lvl{margin-top:0;padding-top:0;border-top:0;border-left:1px solid var(--line);
    padding-left:.8rem}
  .floor.under .fl-lvl{border-left-color:var(--line-dk)}
  .spec{grid-template-columns:1fr;gap:0}
}
@media(max-width:560px){
  .bldg{--pad:20px}
  .flat{grid-template-columns:52px 1fr;gap:.3rem 1rem}
  .flat .st{grid-column:2}
}

/* =========================================================
   v5 · HERO — bez dvojstĺpca, typografia cez celú šírku
   ========================================================= */
.hero5{position:relative;background:var(--paper);overflow:hidden;
  border-bottom:1px solid var(--line)}
.hero5 .bldg{padding-top:96px;padding-bottom:84px}
.hero5-in{margin-left:var(--rail);position:relative;z-index:1}
.hero5 h1{font-size:clamp(2.7rem,7.6vw,6.5rem);font-weight:800;letter-spacing:-.035em;
  line-height:.96;margin:1.4rem 0 0;max-width:16ch}
.hero5 h1 .c{color:var(--cu)}
.hero5-sub{font-size:clamp(1.02rem,1.5vw,1.2rem);color:var(--ink-2);max-width:52ch;
  margin-top:1.9rem}
.hero5-tag{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.hero5-tag .yr{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.16em;
  border:1px solid var(--cu);color:var(--cu-deep);padding:.34rem .7rem;border-radius:2px}
.hero5 .cta-row{margin-top:2.6rem}

/* zvislý popis v šachte */
.hero5-rail{position:absolute;left:0;top:96px;width:var(--mark-w);text-align:right;
  font-family:'Space Mono',monospace}
.hero5-rail .t{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);line-height:1.6}
.hero5-rail .n{display:block;font-size:1.5rem;font-weight:700;color:var(--ink);
  margin-top:.5rem;letter-spacing:-.02em}

/* vodorovný odpočet namiesto boxu vpravo */
.readout{border-top:1px solid var(--line);background:var(--dark)}
.readout-in{display:grid;grid-template-columns:repeat(4,1fr);max-width:1420px;margin:0 auto;
  padding:0 44px}
.readout-in div{padding:1.5rem 0 1.55rem;border-left:1px solid var(--line-dk);
  padding-left:1.6rem}
.readout-in div:first-child{border-left:0;padding-left:0}
.readout .k{display:block;font-family:'Space Mono',monospace;font-size:.64rem;
  letter-spacing:.19em;text-transform:uppercase;color:rgba(241,243,245,.46)}
.readout .v{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:1.8rem;letter-spacing:-.03em;color:#F1F3F5;margin-top:.4rem;line-height:1}
.readout .v.c{color:var(--cu-lite)}

@media(max-width:1040px){
  .hero5 .bldg{padding-top:56px;padding-bottom:52px}
  .hero5-in{margin-left:0}
  .hero5-rail{position:static;width:auto;text-align:left;margin-bottom:1.2rem}
  .hero5-rail .n{display:inline;margin-left:.7rem;font-size:1rem}
  .readout-in{grid-template-columns:repeat(2,1fr);padding:0 32px}
  .readout-in div{padding:1.15rem 0 1.2rem;padding-left:1.3rem}
  .readout-in div:nth-child(3){border-left:0;padding-left:0}
  .readout-in div:nth-child(3),.readout-in div:nth-child(4){border-top:1px solid var(--line-dk)}
  .readout .v{font-size:1.4rem}
}
@media(max-width:560px){
  .readout-in{padding:0 20px}
  .hero5 h1{max-width:none}
}

/* =========================================================
   v5 · SEKCIE MIMO DOMU — rozbitý jednotný rytmus
   ========================================================= */
.zone{position:relative;padding:96px 0}
.zone-in{max-width:1420px;margin:0 auto;padding:0 44px}
.zone-h{display:grid;grid-template-columns:196px minmax(0,1fr);gap:0;
  align-items:start;margin-bottom:3rem}
.zone-h .k{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--cu);padding-top:.6rem}
.zone-h h2{font-size:clamp(1.75rem,3vw,2.4rem);font-weight:800;max-width:24ch}
.zone-h p{color:var(--ink-2);max-width:60ch;margin-top:.9rem;font-size:1rem}
.zone.dk{background:var(--dark);color:#F1F3F5}
.zone.dk .zone-h p{color:rgba(241,243,245,.66)}
.zone.tint{background:var(--paper-2)}
@media(max-width:1040px){
  .zone{padding:64px 0}
  .zone-in{padding:0 32px}
  .zone-h{grid-template-columns:1fr;gap:.9rem;margin-bottom:2rem}
  .zone-h .k{padding-top:0}
}
@media(max-width:560px){.zone-in{padding:0 20px}}

/* hero v5 · stena zvončekov je viditeľná textúra, len ustupuje pod nadpisom */
.hero5 .bellwall{
  -webkit-mask-image:radial-gradient(52% 45% at 33% 58%,rgba(0,0,0,.2) 0,rgba(0,0,0,.3) 44%,rgba(0,0,0,.7) 74%,#000 100%);
  mask-image:radial-gradient(52% 45% at 33% 58%,rgba(0,0,0,.2) 0,rgba(0,0,0,.3) 44%,rgba(0,0,0,.7) 74%,#000 100%)}
/* silnejšia kresba panelu, nech stena nepôsobí ako prázdne pozadie */
.hero5 .bellrow{border-bottom-color:rgba(21,24,28,.13);border-right-color:rgba(21,24,28,.13)}
.hero5 .bname{color:rgba(21,24,28,.27);border-color:rgba(21,24,28,.15);
  background:rgba(21,24,28,.03)}
.hero5 .bbtn{border-color:rgba(21,24,28,.2)}
.hero5 .bellrow.on .bname{color:rgba(224,123,24,.72);border-color:rgba(224,123,24,.3);
  background:rgba(224,123,24,.06)}
.hero5 .bellrow.on .bbtn{border-color:rgba(224,123,24,.8);background:rgba(224,123,24,.3)}
@media(max-width:1040px){
  .hero5 .bellwall{opacity:.92;
    -webkit-mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.66) 13%,rgba(0,0,0,.36) 33%,rgba(0,0,0,.36) 71%,rgba(0,0,0,.7) 88%,#000 100%);
    mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.66) 13%,rgba(0,0,0,.36) 33%,rgba(0,0,0,.36) 71%,rgba(0,0,0,.7) 88%,#000 100%)}
}

/* panel vchodu · diagram + legenda vnútri jedného prístroja */
.fl-door .dbody{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:2rem;align-items:center}
.fl-door svg{width:100%;height:auto;max-height:330px}
.dleg{display:grid;gap:.1rem;align-content:center}
.dleg > div{display:grid;grid-template-columns:26px 1fr;gap:.9rem;align-items:start;
  padding:.85rem 0;border-top:1px solid var(--line-dk)}
.dleg > div:first-child{border-top:0;padding-top:0}
.dleg .n{font-family:'Space Mono',monospace;font-size:.72rem;color:var(--cu-lite);padding-top:.1rem}
.dleg b{display:block;font-family:'Space Mono',monospace;font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:#F1F3F5;font-weight:400}
.dleg span{display:block;font-size:.85rem;color:rgba(241,243,245,.55);line-height:1.45;margin-top:.25rem}
@media(max-width:900px){
  .fl-door{padding:1.2rem 1.2rem 1rem}
  .fl-door .dbody{grid-template-columns:1fr;gap:1rem}
  .fl-door svg{max-height:260px}
}

/* označenie podlažia na podstránke — nadväzuje na dom z homepage */
.plev{display:flex;align-items:baseline;gap:.85rem;margin-bottom:1.5rem;
  font-family:'Space Mono',monospace;flex-wrap:wrap}
.plev .n{font-size:1.35rem;font-weight:700;color:var(--cu);letter-spacing:-.02em;line-height:1}
.plev .m{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:currentColor;opacity:.74}
.plev .l{font-size:.66rem;letter-spacing:.1em;color:currentColor;opacity:.5;
  border-left:1px solid currentColor;padding-left:.85rem}
@media(max-width:560px){.plev{gap:.6rem;margin-bottom:1.1rem}.plev .n{font-size:1.05rem}}

/* hero v5 · popisky a šachta musia čitateľne sadnúť na stenu zvončekov */
.hero5-rail .t,.hero5-rail .n{
  text-shadow:0 0 10px var(--paper),0 0 4px var(--paper),0 0 2px var(--paper)}
.hero5-tag .yr{background:var(--paper)}
.hero5-tag .lbl{text-shadow:0 0 10px var(--paper),0 0 4px var(--paper)}
.hero5 .shaft::before,.hero5 .shaft::after{background:rgba(21,24,28,.26)}
.hero5 .shaft i{opacity:.85;width:2px;margin-left:-1px}
.hero5 .btn-sec{background:var(--paper)}
.hero5 .btn-sec:hover{background:var(--ink)}

/* kamery · na mobile nesmie silueta sedieť pod textom */
@media(max-width:900px){
  .phero.full{min-height:76vh}
  .phero.full .vfbg{transform:translateX(30%);transform-origin:center}
  .phero.full::after{background:
    linear-gradient(90deg,rgba(19,22,26,.95) 0%,rgba(19,22,26,.86) 44%,rgba(19,22,26,.3) 84%),
    linear-gradient(180deg,rgba(19,22,26,.62) 0%,rgba(19,22,26,.1) 28%,rgba(19,22,26,.35) 60%,rgba(19,22,26,.92) 94%)}
}



/* =========================================================
   FOTOGRAFICKÉ TABULE
   Pevná výška, nie pomer strán. Fotka sa nikdy neroztiahne
   cez celú obrazovku a riadky v mriežke sú vždy zarovnané.
   ========================================================= */
.figs{display:grid;gap:14px;margin-top:2.8rem}
.figs.two{grid-template-columns:1fr 1fr}
.figs.three{grid-template-columns:repeat(3,1fr)}

.fig{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:var(--paper-2);display:flex;flex-direction:column}
.fig img{width:100%;height:clamp(230px,27vw,400px);object-fit:cover;display:block}
/* samostatná fotka: obmedzená šírka, inak by ju orez zredukoval na pásik */
.fig.wide{max-width:860px}
.fig.wide img{height:clamp(260px,34vw,540px)}
.fig figcaption{display:flex;align-items:baseline;gap:.85rem;padding:.8rem 1.05rem;
  border-top:1px solid var(--line);font-family:'Space Mono',monospace;font-size:.66rem;
  letter-spacing:.12em;text-transform:uppercase;line-height:1.45}
.fig .n{color:var(--cu);flex:none}
.fig .t{color:var(--ink-2)}

/* na tmavom podklade */
.floor.under .fig,.zone.dk .fig,.band-dark .fig{border-color:var(--line-dk);background:var(--dark-2)}
.floor.under .fig figcaption,.zone.dk .fig figcaption,.band-dark .fig figcaption{
  border-top-color:var(--line-dk)}
.floor.under .fig .t,.zone.dk .fig .t,.band-dark .fig .t{color:rgba(241,243,245,.62)}

@media(max-width:820px){
  .figs.two,.figs.three{grid-template-columns:1fr}
  .figs{margin-top:2rem;gap:12px}
}

/* --- kompozície fotiek, iná pre každú podstránku --------------- */

/* A) nerovnomerná dvojica: hlavný pohľad + detail (prístupové systémy) */
.figs.split{grid-template-columns:1.2fr .8fr;align-items:start}
.figs.split .fig:first-child img{height:clamp(300px,38vw,540px)}
.figs.split .fig:last-child img{height:clamp(220px,26vw,360px)}

/* B) dvojica spojená osou vchod → byt (zvončeky) */
.figs.axis{grid-template-columns:1fr 96px 1fr;align-items:center;gap:0}
.figs.axis .fig img{height:clamp(240px,28vw,400px)}
.ax{display:flex;flex-direction:column;align-items:center;gap:.7rem;
  font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-3);padding:0 .4rem}
.ax i{display:block;width:1px;flex:1;min-height:54px;
  background:repeating-linear-gradient(to bottom,var(--cu) 0 6px,transparent 6px 13px);opacity:.6}
.ax .a{color:var(--ink-2)}

/* C) kamerový monitor (kamery) — dva kanály vedľa seba */
.cctv.two{grid-template-columns:1fr 1fr;margin-top:2.8rem}
.cctv.two .cam{aspect-ratio:16/10}
.zone-plain .cam{border-color:var(--line)}
.zone-plain .cam .osd{color:#F1F3F5}

@media(max-width:820px){
  .figs.split,.figs.axis{grid-template-columns:1fr;gap:12px}
  .figs.split .fig:first-child img,.figs.split .fig:last-child img{height:clamp(230px,50vw,320px)}
  .ax{flex-direction:row;padding:.2rem 0}
  .ax i{width:auto;height:1px;min-height:0;min-width:40px;
    background:repeating-linear-gradient(to right,var(--cu) 0 6px,transparent 6px 13px)}
  .cctv.two{grid-template-columns:1fr}
}