/* ==========================================================================
   YLIOS GB — hlavný štýl témy
   1. Tokeny a reset      5. Sekcie domovskej stránky
   2. Typografia          6. Formulár
   3. Tlačidlá            7. Vnútorné stránky
   4. Navigácia           8. Footer / responzivita
   ========================================================================== */

/* 1. TOKENY A RESET ------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
 /* značková oranžová a jej odvodené odtiene */
 --g:#FF5A1F;--g-hi:#FF7440;--g-lo:#D93F0C;--g-deep:#9A3208;
 --g-wash:#FFF2EC;--g-wash2:#FFDCCB;
 /* teplá neutrálna škála — k oranžovej sedí lepšie než zelenkastá */
 --ink:#131110;--ink2:#1C1917;--deep:#181310;
 --tx:#1A1613;--tx2:#57504B;--tx3:#6E6862;
 --pap:#fff;--pap2:#F7F5F3;--line:#E9E5E1;--line2:#DAD4CE;
 /* stavy formulára — zámerne iný odtieň než značka */
 --ok:#256B2A;--ok-bg:#EDF7EE;--ok-line:#CBE6CD;--ok-w:#BFE6C4;
 --err:#B3261E;--err-bg:#FDECEC;--err-line:#F6C9C9;--err-w:#F5B5B0;--err-line-w:#E8736B;
 /* upozornenie — použité pri platnosti dokladov, zámerne nie značková oranžová */
 --warn:#8A5300;--warn-bg:#FFF4E0;--warn-line:#F0DFB8;
 --f:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
 --w:1240px;--pad:clamp(18px,4vw,40px);
 --nav-h:80px;
 --ease:cubic-bezier(.2,.8,.3,1);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{font-family:var(--f);background:var(--pap);color:var(--tx);line-height:1.65;overflow-x:clip;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;height:auto}
button{font-family:inherit}
svg{flex-shrink:0}
:focus-visible{outline:2px solid var(--g-lo);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-9999px;background:var(--g);color:var(--ink);padding:14px 22px;z-index:9999;font-weight:700;font-size:13px}
.skip:focus{left:0;top:0}
.w{max-width:var(--w);margin:0 auto;padding:0 var(--pad)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* 2. TYPOGRAFIA --------------------------------------------------------- */
h1,h2,h3,h4{letter-spacing:-.035em;line-height:1.06;font-weight:700}
.mega{font-size:clamp(2.2rem,5.6vw,4.5rem);font-weight:800;letter-spacing:-.045em;line-height:1.0}
.big{font-size:clamp(1.95rem,4.6vw,3.6rem);font-weight:700;letter-spacing:-.04em;line-height:1.04;text-wrap:balance}
.mid{font-size:clamp(1.5rem,3vw,2.3rem);font-weight:700;letter-spacing:-.036em;line-height:1.1;text-wrap:balance}
.h3{font-size:clamp(1.05rem,1.5vw,1.32rem);font-weight:700;letter-spacing:-.024em;line-height:1.22}
.fade{color:var(--tx3)}
.fade-w{color:rgba(255,255,255,.62)}
.acc{color:var(--g-lo)}
.acc-w{color:var(--g)}
.lede{font-size:clamp(.95rem,1.12vw,1.08rem);color:var(--tx2);line-height:1.8}
.lede-w{color:rgba(255,255,255,.76)}
.tagline{display:inline-flex;align-items:center;gap:8px;font-size:.6rem;font-weight:800;letter-spacing:.19em;text-transform:uppercase;color:var(--g-deep);margin-bottom:14px}
.tagline--w{color:var(--g)}
.tagline svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4}
.block{display:block}

/* 3. TLAČIDLÁ ----------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:.82rem;font-weight:700;padding:15px 28px;border-radius:100px;border:1.5px solid transparent;cursor:pointer;transition:.24s var(--ease);white-space:nowrap;text-align:center}
/* Ikona v tlačidle. Bez tejto veľkosti sa SVG roztiahne na desiatky pixelov
   a tlačidlo narastie do neúmerných rozmerov. Téma to doteraz riešila zvlášť
   pre každý kontext — pri novej sekcii sa na to zabudlo. */
.btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;flex-shrink:0}
.btn--g{background:var(--g);color:var(--ink)}
.btn--g:hover{background:var(--g-hi);transform:translateY(-2px)}
.btn--w{background:#fff;color:var(--ink)}
.btn--w:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
.btn--d{background:var(--ink);color:#fff}
.btn--d:hover{background:#2A2521;transform:translateY(-2px)}
.btn--o{background:transparent;border-color:var(--line2);color:var(--tx)}
.btn--o:hover{border-color:var(--g);background:var(--g-wash);color:var(--g-deep)}
.btn--ow{background:transparent;border-color:rgba(255,255,255,.42);color:#fff}
.btn--ow:hover{background:rgba(255,255,255,.12)}
.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
.ar{font-size:.78rem}
.go{display:inline-flex;align-items:center;min-height:44px;gap:10px;font-size:.73rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--g-deep);transition:gap .24s;align-self:flex-start}
.go i{width:27px;height:27px;border-radius:50%;background:var(--g);color:var(--ink);display:grid;place-items:center;font-style:normal;font-size:.68rem;font-weight:800}
.go:hover{gap:15px}

/* 4. NAVIGÁCIA ---------------------------------------------------------- */
.nav{position:absolute;top:0;left:0;right:0;z-index:300;transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.nav--solid{position:fixed;background:rgba(255,255,255,.94);backdrop-filter:saturate(180%) blur(14px);box-shadow:0 1px 0 var(--line),0 10px 30px -22px rgba(19,17,16,.35)}
.nav__in{display:flex;align-items:center;gap:26px;height:var(--nav-h)}
.nav__logo{display:flex;align-items:center;min-height:44px;flex-shrink:0}
.nav__logo img{height:32px;width:auto}
.nav__logo .lg--dark{display:none}
.nav--solid .nav__logo .lg--dark{display:block}
.nav--solid .nav__logo .lg--light{display:none}
.nav__m{display:flex;list-style:none;gap:2px;flex:1;justify-content:center}
.nav__m>li{position:relative}
.nav__m>li>a{display:flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;color:rgba(255,255,255,.9);padding:9px 16px;border-radius:100px;transition:.2s}
.nav__m>li>a:hover{background:rgba(255,255,255,.14);color:#fff}
.nav__m>li.is-active>a{color:#fff}
.nav--solid .nav__m>li>a{color:var(--tx2)}
.nav--solid .nav__m>li>a:hover{background:var(--g-wash);color:var(--g-deep)}
.nav--solid .nav__m>li.is-active>a{color:var(--g-deep)}
.car{width:5px;height:5px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6;transition:.2s}
.nav__m>li:hover .car,.nav__m>li:focus-within .car{transform:rotate(225deg) translateY(-1px)}
.dd,.nav__m .sub-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(-8px);background:#fff;border-radius:18px;padding:10px;width:360px;opacity:0;visibility:hidden;transition:.26s var(--ease);box-shadow:0 26px 66px rgba(0,0,0,.22);list-style:none}
.nav__m>li:hover .dd,.nav__m>li:focus-within .dd,
.nav__m>li.je-otvorene .dd,
.nav__m>li:hover .sub-menu,.nav__m>li:focus-within .sub-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
/* Medzi položkou menu a kartou je 10 px medzera. Bez mostíka by sa
   rozbaľovač pri prechode myšou nadol zatvoril skôr, než naň stihneš prísť —
   je to jedna z tých drobností, ktoré človek nevie pomenovať, len ho to
   podráždi. Mostík je neviditeľný a existuje len počas otvorenia. */
.dd::before,.nav__m .sub-menu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.dd a,.nav__m .sub-menu a{display:flex;gap:12px;padding:12px 13px;border-radius:12px;transition:.16s;font-size:.84rem;font-weight:600;color:var(--tx)}
.dd a:hover,.nav__m .sub-menu a:hover{background:var(--g-wash);color:var(--g-deep)}
/* položka hlavného menu s podpoložkami dostane šípku aj bez ručného markupu */
.nav__m>li.menu-item-has-children>a::after{content:"";width:5px;height:5px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6;transition:.2s}
.nav__m>li.menu-item-has-children:hover>a::after{transform:rotate(225deg) translateY(-1px)}
.dd__ic{width:34px;height:34px;border-radius:10px;background:var(--g-wash2);display:grid;place-items:center;flex-shrink:0}
.dd__ic svg{width:16px;height:16px;stroke:var(--g-deep);fill:none;stroke-width:1.9}
.dd__t{display:block;font-size:.84rem;font-weight:700;color:var(--tx);margin-bottom:2px}
.dd__d{display:block;font-size:.71rem;color:var(--tx2);line-height:1.45}
.nav__r{display:flex;align-items:center;gap:14px;flex-shrink:0;margin-left:auto}
.nav__tel{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 4px;font-size:.8rem;font-weight:700;color:#fff}
.nav__tel svg{width:14px;height:14px;stroke:var(--g);fill:none;stroke-width:2}
.nav--solid .nav__tel{color:var(--tx)}
.nav--solid .nav__r .btn--w{background:var(--g);color:var(--ink)}
.burger{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:0;background:none;border:0;cursor:pointer}
.burger span{width:21px;height:2px;background:#fff;border-radius:2px;display:block;transition:.28s var(--ease)}
.nav--solid .burger span{background:var(--ink)}
.burger[aria-expanded="true"] span{background:var(--ink)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* mobilná zásuvka */
.drawer{position:fixed;inset:0;z-index:290;background:#fff;padding:calc(var(--nav-h) + 16px) var(--pad) 40px;overflow-y:auto;transform:translateY(-100%);visibility:hidden;transition:transform .38s var(--ease),visibility .38s}
.drawer[data-open="true"]{transform:translateY(0);visibility:visible}
.drawer ul{list-style:none}
.drawer>ul>li{border-bottom:1px solid var(--line)}
.drawer>ul>li>a{display:block;padding:17px 2px;font-size:1.06rem;font-weight:700;letter-spacing:-.02em}
.drawer .sub,.drawer .sub-menu{padding:0 0 14px 2px;display:flex;flex-direction:column;gap:2px}
.drawer .sub a,.drawer .sub-menu a{display:block;padding:10px 0;font-size:.9rem;color:var(--tx2)}
.drawer .sub a::before,.drawer .sub-menu a::before{content:"— ";color:var(--g-lo)}
.drawer__cta{display:flex;flex-direction:column;gap:10px;margin-top:26px}
body.drawer-open{overflow:hidden}

/* 5. SEKCIE ------------------------------------------------------------- */
.hero{position:relative;min-height:min(90vh,820px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.hero__img{position:absolute;inset:0}
.hero__img img{width:100%;height:100%;object-fit:cover}
.hero__sh{position:absolute;inset:0;background:
 linear-gradient(to bottom,rgba(10,7,5,.72) 0%,rgba(10,7,5,.3) 26%,rgba(10,7,5,.72) 62%,rgba(10,7,5,.94) 100%),
 linear-gradient(105deg,rgba(10,7,5,.6) 0%,rgba(10,7,5,.28) 46%,rgba(10,7,5,0) 78%)}
/* Obsah hero sekcie je zarovnaný k jej spodku, takže na vysokých obrazovkách
   určuje odstup nadpisu od menu výška sekcie a horné odsadenie sa neprejaví.
   Na notebookoch je to naopak: sekcia má presne výšku obsahu a nadpis skončí
   presne toľko pod menu, koľko mu tu dáme. Preto je tá hodnota takto veľká —
   pri 150 px zostávalo pod menu len 70 px voľného miesta. */
.hero__in{position:relative;z-index:2;width:100%;padding-bottom:clamp(46px,6.5vw,82px);padding-top:clamp(190px,20vh,250px)}
.hero__h{color:#fff;margin-bottom:20px;animation:up .9s var(--ease) both;max-width:20ch}
.hero__h .l1,.hero__h .l2{display:block}
.hero__sub{max-width:50ch;font-size:clamp(.95rem,1.35vw,1.16rem);color:rgba(255,255,255,.9);font-weight:500;margin-bottom:30px;animation:up .9s var(--ease) .1s both}
.hero__acts{display:flex;gap:12px;flex-wrap:wrap;animation:up .9s var(--ease) .18s both}
.hero__chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px;animation:up .9s var(--ease) .26s both;list-style:none}
.hero__chips li{display:inline-flex;align-items:center;gap:7px;font-size:.74rem;font-weight:600;color:rgba(255,255,255,.86);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px);padding:8px 14px;border-radius:100px}
.hero__chips svg{width:13px;height:13px;stroke:var(--g);fill:none;stroke-width:2.6}
@keyframes up{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

.strip{background:var(--ink2);border-top:1px solid rgba(255,255,255,.08)}
.strip__in{display:flex;align-items:stretch;flex-wrap:wrap}
/* Číslo a popis pod sebou, nie vedľa seba. Vedľa seba zostávalo na text
   pri piatich stĺpcoch okolo 95 px, takže sa lámal do troch riadkov a tlačil
   sa k deliacej čiare. Pod číslom má celú šírku bunky. */
.strip__i{flex:1 1 0;min-width:180px;display:flex;flex-direction:column;justify-content:center;gap:9px;padding:22px clamp(16px,2vw,26px);border-right:1px solid rgba(255,255,255,.08)}
.strip__i:last-child{border-right:0}
.strip__i b{font-size:clamp(1.25rem,2vw,1.7rem);font-weight:800;letter-spacing:-.045em;color:var(--g);line-height:1;flex-shrink:0}
.strip__i span{font-size:.77rem;color:rgba(255,255,255,.72);line-height:1.45;text-wrap:balance}

.s{padding:clamp(70px,9vw,132px) 0}
.s--tight{padding:clamp(44px,5.5vw,72px) 0}
.s--pap2{background:var(--pap2)}
.s--deep{background:var(--deep);color:#fff}
.hd{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(26px,5vw,64px);align-items:end;margin-bottom:clamp(32px,4.4vw,56px)}
.hd--c{grid-template-columns:1fr;text-align:center;max-width:820px;margin-inline:auto}
.hd--c .tagline{justify-content:center}

/* služby — mriežka 2×2 s orámovanou fotografiou vnútri karty */
.svc{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,1.8vw,24px);align-items:stretch}
.sc{position:relative;background:#fff;border:1px solid var(--line);border-radius:26px;
 padding:clamp(15px,1.5vw,20px);display:flex;flex-direction:column;
 transition:transform .38s var(--ease),box-shadow .38s var(--ease),border-color .38s var(--ease)}
.sc:hover{transform:translateY(-6px);box-shadow:0 34px 68px -30px rgba(19,17,16,.26);border-color:var(--g)}
.sc__ph{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:16px;background:var(--pap2)}
.sc__ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.sc:hover .sc__ph img{transform:scale(1.07)}
.sc__no{position:absolute;top:14px;left:14px;background:var(--g);color:var(--ink);
 font-size:.62rem;font-weight:800;letter-spacing:.14em;padding:8px 14px;border-radius:100px}
.sc__b{padding:clamp(20px,2vw,26px) clamp(6px,.8vw,10px) clamp(4px,.6vw,8px);display:flex;flex-direction:column;flex:1}
.sc__t{margin-bottom:12px;font-size:clamp(1.12rem,1.5vw,1.42rem)}
.sc__x{font-size:.88rem;color:var(--tx2);line-height:1.75;margin-bottom:20px;flex:1}
.tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:22px;list-style:none}
.tags li{font-size:.69rem;font-weight:600;color:var(--g-deep);background:var(--g-wash);border:1px solid var(--g-wash2);padding:6px 12px;border-radius:100px}
/* pätka karty — oddelená linkou, odkaz vpravo */
.sc__f{display:flex;align-items:center;justify-content:space-between;gap:16px;
 margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}
.sc__meta{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3)}
.sc__f .go{align-self:auto}

/* segmenty */
.pk{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.7vw,20px)}
.pkc{position:relative;border-radius:22px;overflow:hidden;background:var(--ink);min-height:400px;display:flex;align-items:flex-end}
.pkc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.pkc:hover img{transform:scale(1.06)}
.pkc__v{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,7,5,.96) 0%,rgba(10,7,5,.9) 26%,rgba(10,7,5,.6) 46%,rgba(10,7,5,.2) 68%,rgba(10,7,5,0) 92%)}
.pkc__c{position:relative;z-index:2;padding:clamp(20px,2.4vw,28px);width:100%}
.pkc__e{font-size:.6rem;font-weight:800;letter-spacing:.19em;text-transform:uppercase;color:var(--g);margin-bottom:9px}
.pkc__t{font-size:clamp(1.08rem,1.6vw,1.32rem);font-weight:700;color:#fff;letter-spacing:-.026em;line-height:1.18;margin-bottom:9px}
.pkc__x{font-size:.82rem;color:rgba(255,255,255,.8);line-height:1.62}

/* dotácie */
.dot{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:center}
.dot__cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:24px;transition:.24s}
.dcard:hover{border-color:var(--g);background:rgba(255,90,31,.08)}
.dcard b{display:block;font-size:clamp(1.5rem,2.4vw,2.05rem);font-weight:800;letter-spacing:-.045em;color:var(--g);line-height:1;margin-bottom:9px}
.dcard span{font-size:.8rem;color:rgba(255,255,255,.74);line-height:1.6}
.dlist,.klist{list-style:none;display:flex;flex-direction:column;gap:13px;margin-top:26px}
.dlist li,.klist li{display:flex;gap:12px;font-size:.9rem}
.dlist li{color:rgba(255,255,255,.78)}
.klist li{color:var(--tx2)}
.dlist svg,.klist svg{width:18px;height:18px;fill:none;stroke-width:2.6;flex-shrink:0;margin-top:3px}
.dlist svg{stroke:var(--g)}
.klist svg{stroke:var(--g-lo)}

/* kalkulačka */
.kal{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,76px);align-items:center}
/* keď je box podstatne vyšší než text vedľa, stred nechá hore prázdno */
.kal--top{align-items:start}
.kal--top>:first-child{position:sticky;top:calc(var(--nav-h) + 28px)}
.kbox{background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(24px,3vw,38px);box-shadow:0 30px 70px -28px rgba(19,17,16,.2)}
.kh{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px}
.kh b{font-size:1.04rem;font-weight:700;letter-spacing:-.024em}
.kh span{font-size:.6rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--g-deep);background:var(--g-wash);padding:6px 12px;border-radius:100px}
.fl__l{display:flex;justify-content:space-between;align-items:baseline;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx2);margin-bottom:14px}
.fl__v{font-size:1.05rem;font-weight:800;color:var(--tx);letter-spacing:-.03em;text-transform:none}
.rng{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;outline:none;cursor:pointer;display:block;margin:-8px 0}
.rng::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--g) 0%,var(--g) var(--p,20%),var(--line) var(--p,20%))}
.rng::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-10px;border-radius:50%;background:#fff;border:5px solid var(--g);cursor:pointer;box-shadow:0 3px 12px rgba(19,17,16,.2)}
.rng::-moz-range-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--g) 0%,var(--g) var(--p,20%),var(--line) var(--p,20%))}
.rng::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:5px solid var(--g);cursor:pointer;box-shadow:0 3px 12px rgba(19,17,16,.2)}
.rmark{display:flex;justify-content:space-between;font-size:.72rem;font-weight:600;color:var(--tx2);margin-top:10px}
.kout{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:30px 0 22px}
.kc{background:var(--pap2);border-radius:16px;padding:19px 20px}
.kc span{display:block;font-size:.66rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--tx2);margin-bottom:7px}
.kc b{font-size:1.6rem;font-weight:800;letter-spacing:-.04em;line-height:1;display:block}
.kc b em{font-style:normal;font-size:.68rem;color:var(--g-deep);font-weight:700;margin-left:4px}
.kc--hi{background:var(--ink)}
.kc--hi span{color:rgba(255,255,255,.48)}
.kc--hi b{color:#fff}
.kc--hi b em{color:var(--g)}
.knote{font-size:.72rem;color:var(--tx2);line-height:1.6;margin-top:14px;text-align:center}

/* postup */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,22px);list-style:none}
.st{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(24px,2.7vw,32px);transition:.3s var(--ease);
 display:flex;flex-direction:column}
.st:hover{transform:translateY(-4px);box-shadow:0 22px 48px -22px rgba(19,17,16,.16);border-color:var(--g)}
.st__n{width:42px;height:42px;border-radius:13px;background:var(--ink);color:var(--g);display:grid;place-items:center;font-size:.9rem;font-weight:800;margin-bottom:20px}
.st__t{margin-bottom:10px}
.st__d{font-size:.84rem;color:var(--tx2);line-height:1.75}
.st__m{margin-top:auto;padding-top:18px;padding-top:15px;border-top:1px solid var(--line);font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--g-deep)}

/* realizácie */
.rz{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(14px,1.6vw,20px);align-items:stretch}
.rzbig{position:relative;border-radius:24px;overflow:hidden;background:var(--ink);display:flex;align-items:flex-end;min-height:400px}
.rzbig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.rzbig:hover img{transform:scale(1.05)}
.rzbig__v{position:absolute;inset:0;background:linear-gradient(to top,rgba(12,8,6,.96) 0%,rgba(12,8,6,.88) 26%,rgba(12,8,6,.5) 50%,rgba(12,8,6,.14) 78%,rgba(12,8,6,0) 100%)}
.rzbig__c{position:relative;z-index:2;padding:clamp(26px,3.2vw,40px);width:100%}
.rzbig__e{font-size:.62rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--g);margin-bottom:12px}
.rzbig__t{font-size:clamp(1.3rem,2.4vw,2rem);font-weight:800;letter-spacing:-.038em;color:#fff;line-height:1.1;margin-bottom:12px}
.rzbig__x{font-size:.9rem;color:rgba(255,255,255,.78);line-height:1.7;max-width:52ch}
.rzlist{background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(22px,2.6vw,30px);display:flex;flex-direction:column}
.rzlist__h{font-size:.63rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--g-deep);padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:4px}
.rzrow{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.rzrow:last-of-type{border-bottom:0}
.rzrow b{font-size:.88rem;font-weight:700;letter-spacing:-.02em;line-height:1.3;display:block}
.rzrow span{display:block;font-size:.74rem;color:var(--tx3);margin-top:2px}
.rzrow em{margin-left:auto;font-style:normal;font-size:.76rem;font-weight:800;color:var(--g-deep);background:var(--g-wash);padding:6px 12px;border-radius:100px;white-space:nowrap}
.rzlist .go{margin-top:20px}

/* partneri — nekonečný pás s logami
   Sekcia je zámerne biela: väčšina dodaných log má bielu podkladovú plochu,
   ktorá by na sivom pozadí presvitala ako obdĺžnik. */
.s--brands{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.marquee{position:relative;overflow:hidden;
 -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
 mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.marquee__track{display:flex;width:max-content;animation:slide 46s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__group{display:flex;align-items:center;flex-shrink:0}
.marquee__i{display:grid;place-items:center;width:clamp(128px,12.5vw,170px);height:70px;padding:0 clamp(12px,1.6vw,22px)}
.marquee__i img{max-width:100%;max-height:46px;width:auto;object-fit:contain;
 filter:grayscale(1) contrast(1.12);opacity:.6;transition:.3s var(--ease)}
.marquee__i:hover img{filter:none;opacity:1}
@keyframes slide{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* FAQ */
.faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,5vw,76px);align-items:start}
.qas{display:flex;flex-direction:column;gap:10px}
.qa{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.26s}
.qa[open]{border-color:var(--g);box-shadow:0 16px 40px -20px rgba(19,17,16,.16)}
.qa summary{list-style:none;cursor:pointer;padding:21px 25px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:.95rem;font-weight:600;letter-spacing:-.018em}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--g-deep)}
.pm{width:29px;height:29px;border-radius:50%;background:var(--g-wash);display:grid;place-items:center;flex-shrink:0;position:relative;transition:.3s}
.pm::before,.pm::after{content:"";position:absolute;background:var(--g-deep);border-radius:2px;transition:.3s}
.pm::before{width:11px;height:2px}
.pm::after{width:2px;height:11px}
.qa[open] .pm{background:var(--g);transform:rotate(135deg)}
.qa[open] .pm::before,.qa[open] .pm::after{background:var(--ink)}
.qa__a{padding:0 25px 23px;font-size:.88rem;color:var(--tx2);line-height:1.85}
.qa__a strong{color:var(--tx);font-weight:600}
.qa__a p+p{margin-top:12px}

/* CTA */
.cta{position:relative;overflow:hidden;background:var(--ink);color:#fff;padding:clamp(70px,9vw,130px) 0}
.cta__bg{position:absolute;inset:0}
.cta__bg img{width:100%;height:100%;object-fit:cover}
.cta__veil{position:absolute;inset:0;background:linear-gradient(105deg,rgba(12,8,6,.96) 0%,rgba(12,8,6,.82) 42%,rgba(12,8,6,.42) 72%,rgba(12,8,6,.2) 100%)}
.cta__glow{position:absolute;left:-8%;top:12%;width:min(760px,80vw);height:min(560px,60vw);background:radial-gradient(closest-side,rgba(255,90,31,.28),transparent 70%);filter:blur(10px);pointer-events:none}
.cta__mesh{position:absolute;inset:0;opacity:.5;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(60% 70% at 20% 50%,#000,transparent 78%);mask-image:radial-gradient(60% 70% at 20% 50%,#000,transparent 78%)}
.cta__in{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(32px,5vw,68px);align-items:start}
.cta__x{font-size:clamp(.95rem,1.3vw,1.08rem);color:rgba(255,255,255,.78);line-height:1.8;max-width:46ch;margin:20px 0 30px}
.cta__tel{display:flex;align-items:center;gap:10px;margin-top:26px;font-size:.84rem;color:rgba(255,255,255,.68)}
.cta__tel a{color:var(--g);font-weight:700;display:inline-block;padding:10px 0}
.cta__tel svg{width:16px;height:16px;stroke:var(--g);fill:none;stroke-width:2}
/* sklenená karta „Čo bude nasledovať“ */
.ctacard{background:rgba(255,255,255,.07);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:clamp(24px,3vw,34px)}
.ctacard__h{display:flex;align-items:center;gap:11px;font-size:.63rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--g);padding-bottom:18px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.12)}
.ctacard__h svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.4}
.cta__a{display:flex;gap:12px;flex-wrap:wrap}
.ctasteps{list-style:none}
.ctastep{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.ctastep:last-child{border-bottom:0;padding-bottom:0}
.ctastep__n{width:30px;height:30px;border-radius:10px;background:rgba(255,90,31,.16);border:1px solid rgba(255,90,31,.34);color:var(--g);display:grid;place-items:center;font-size:.72rem;font-weight:800;flex-shrink:0}
.ctastep__tx{flex:1;min-width:0}
.ctastep__t{display:block;font-size:.88rem;font-weight:700;color:#fff;margin-bottom:4px;letter-spacing:-.018em}
.ctastep__d{display:block;font-size:.78rem;color:rgba(255,255,255,.66);line-height:1.6}
.ctastep__w{margin-left:auto;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);white-space:nowrap;align-self:center}

/* 6. FORMULÁR ----------------------------------------------------------- */
.fbox{background:rgba(255,255,255,.07);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:clamp(24px,3vw,34px)}
.fbox__h{display:flex;align-items:center;justify-content:space-between;gap:11px;font-size:.63rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--g);padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid rgba(255,255,255,.12)}
.fbox__h em{font-style:normal;color:rgba(255,255,255,.5);letter-spacing:.1em}
.form{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.fld{display:flex;flex-direction:column;gap:7px}
.fld--full{grid-column:1/-1}
.fld label{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.66)}
.fld label .req{color:var(--g)}
.fld input,.fld select,.fld textarea{width:100%;font-family:inherit;font-size:.9rem;color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:13px;padding:13px 15px;min-height:48px;transition:.2s}
.fld textarea{min-height:110px;resize:vertical;line-height:1.6}
.fld select{-webkit-appearance:none;appearance:none;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='%23FF5A1F' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-right:40px}
.fld select option{background:#12211a;color:#fff}
.fld input::placeholder,.fld textarea::placeholder{color:rgba(255,255,255,.38)}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--g);background:rgba(255,255,255,.12);outline:none}
.fld[data-invalid="true"] input,.fld[data-invalid="true"] textarea,.fld[data-invalid="true"] select{border-color:var(--err-line-w)}
.fld__err{font-size:.72rem;color:var(--err-w);display:none}
.fld[data-invalid="true"] .fld__err{display:block}
.consent{grid-column:1/-1;display:flex;gap:11px;align-items:flex-start;margin-top:2px}
.consent input{width:19px;height:19px;min-height:0;flex-shrink:0;margin-top:3px;accent-color:var(--g)}
.consent label{font-size:.76rem;line-height:1.6;text-transform:none;letter-spacing:0;font-weight:500;color:rgba(255,255,255,.68)}
.consent a{color:var(--g);text-decoration:underline;text-underline-offset:2px}
.form>.btn{grid-column:1/-1;width:100%;margin-top:6px}
.hp{position:absolute!important;left:-9999px!important;opacity:0;height:0;width:0}
.fmsg{grid-column:1/-1;border-radius:13px;padding:15px 17px;font-size:.86rem;line-height:1.65;display:none}
.fmsg[data-state="ok"]{display:block;background:rgba(37,107,42,.18);border:1px solid rgba(37,107,42,.5);color:var(--ok-w)}
.fmsg[data-state="err"]{display:block;background:rgba(179,38,30,.16);border:1px solid rgba(179,38,30,.5);color:var(--err-w)}
.fbox--light{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(19,17,16,.2)}
.fbox--light .fbox__h{color:var(--g-deep);border-bottom-color:var(--line)}
.fbox--light .fbox__h em{color:var(--tx3)}
.fbox--light .fld label{color:var(--tx2)}
.fbox--light .fld input,.fbox--light .fld select,.fbox--light .fld textarea{color:var(--tx);background:var(--pap2);border-color:var(--line)}
.fbox--light .fld input::placeholder,.fbox--light .fld textarea::placeholder{color:var(--tx3)}
.fbox--light .fld input:focus,.fbox--light .fld select:focus,.fbox--light .fld textarea:focus{background:#fff;border-color:var(--g)}
.fbox--light .consent label{color:var(--tx2)}
.fbox--light .consent a{color:var(--g-deep)}
.fbox--light .fld select option{background:#fff;color:var(--tx)}
.fbox--light .fmsg[data-state="ok"]{background:var(--ok-bg);border-color:var(--ok-line);color:var(--ok)}
.fbox--light .fmsg[data-state="err"]{background:var(--err-bg);border-color:var(--err-line);color:var(--err)}

/* 7. VNÚTORNÉ STRÁNKY --------------------------------------------------- */
.phead{position:relative;background:var(--ink);color:#fff;padding:calc(var(--nav-h) + clamp(44px,6vw,80px)) 0 clamp(44px,6vw,80px);overflow:hidden}
.phead__img{position:absolute;inset:0;opacity:.4}
.phead__img img{width:100%;height:100%;object-fit:cover}
.phead__v{position:absolute;inset:0;background:linear-gradient(100deg,rgba(12,8,6,.94),rgba(12,8,6,.58))}
/* .phead__in sedí na tom istom prvku ako .w, takže šírku necháme na ňom —
   inak sa obsah vycentruje a nezarovná sa s ostatnými sekciami */
.phead__in{position:relative;z-index:2}
.phead h1{color:#fff;font-size:clamp(1.9rem,4.4vw,3.4rem);font-weight:800;letter-spacing:-.042em;max-width:22ch}
.phead .lede{color:rgba(255,255,255,.78);margin-top:18px;max-width:60ch}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.74rem;color:rgba(255,255,255,.56);margin-bottom:16px;list-style:none}
.crumbs li{display:flex;align-items:center;gap:8px}
.crumbs li+li::before{content:"\203A";opacity:.5}
.crumbs a:hover{color:var(--g)}
.crumbs [aria-current]{color:var(--g)}

.prose{max-width:74ch;font-size:1rem;line-height:1.85;color:var(--tx2)}
.prose>*+*{margin-top:1.15em}
.prose h2{font-size:clamp(1.4rem,2.6vw,2rem);color:var(--tx);margin-top:2em;letter-spacing:-.034em}
.prose h3{font-size:clamp(1.1rem,1.8vw,1.35rem);color:var(--tx);margin-top:1.7em;letter-spacing:-.026em}
.prose strong{color:var(--tx);font-weight:600}
.prose a{color:var(--g-deep);text-decoration:underline;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:1.25em}
.prose li+li{margin-top:.5em}
.prose li::marker{color:var(--g-lo)}
.prose img{border-radius:18px;margin:1.8em 0}
.prose blockquote{border-left:3px solid var(--g);padding:4px 0 4px 22px;font-size:1.05rem;color:var(--tx);font-weight:500}
/* Tlačidlo v obsahu stránky. Pravidlo .prose a má vyššiu špecificitu než
   .btn--g, takže by tlačidlu prebilo farbu aj podčiarknutie — musíme ho
   prebiť späť, inak z tlačidla zostane podčiarknutý zelený text. */
.prose a.btn{text-decoration:none}
.prose a.btn--g{color:var(--ink)}
.prose a.btn--d{color:#fff}
.prose a.btn--w{color:var(--ink)}
.prose a.btn--o{color:var(--tx)}
.prose a.btn--o:hover{color:var(--g-deep)}
.prose .btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.8em}
.prose .btnrow>*{margin-top:0}
.prose table{width:100%;border-collapse:collapse;font-size:.9rem}
.prose th,.prose td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}
.prose th{font-weight:700;color:var(--tx);background:var(--pap2)}

.answer{background:var(--g-wash);border:1px solid var(--g-wash2);border-left:4px solid var(--g);border-radius:14px;padding:20px 24px;font-size:.95rem;line-height:1.75;color:var(--tx)}

/* identifikácia prevádzkovateľa na právnych stránkach — skratka [ylios_prevadzkovatel]
   Názov aj hodnota sú na jednom riadku, kým je miesto; na úzkej obrazovke
   sa hodnota presunie pod názov, aby sa dlhý zápis v registri nelámal
   do dvojznakových stĺpcov. */
.prose .idcard{display:grid;gap:0;margin:1.6em 0;border:1px solid var(--line);
 border-radius:18px;overflow:hidden;background:#fff}
.prose .idcard>div{display:grid;grid-template-columns:11.5rem 1fr;gap:4px 20px;
 padding:13px 20px;border-bottom:1px solid var(--line)}
.prose .idcard>div:last-child{border-bottom:0}
.prose .idcard dt{margin:0;font-size:.6rem;font-weight:800;letter-spacing:.13em;
 text-transform:uppercase;color:var(--tx3);align-self:center}
.prose .idcard dd{margin:0;font-size:.9rem;font-weight:600;line-height:1.55;
 font-variant-numeric:tabular-nums}
@media (max-width:640px){
 .prose .idcard>div{grid-template-columns:1fr}
 .prose .idcard dt{align-self:start}
}

.cols{display:grid;grid-template-columns:1fr .42fr;gap:clamp(30px,5vw,64px);align-items:start}
/* Položka mriežky sa štandardne nezmenší pod šírku svojho obsahu. Stačí
   jedna široká tabuľka alebo blok kódu a roztiahne celý stĺpec cez okraj
   obrazovky — a vnútorné posúvanie sa vtedy vôbec neuplatní. */
.cols>*{min-width:0}
/* kontaktná stránka */
.cols--wide{grid-template-columns:1fr .82fr}
.ktiles{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.4vw,18px)}
.ktile{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(18px,2vw,24px);transition:.3s var(--ease)}
.ktile:hover{border-color:var(--g);transform:translateY(-3px)}
.ktile__ic{width:40px;height:40px;border-radius:12px;background:var(--g-wash);display:grid;place-items:center;margin-bottom:16px}
.ktile__ic svg{width:18px;height:18px;stroke:var(--g-deep);fill:none;stroke-width:1.9}
.ktile__l{font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);margin-bottom:7px}
.ktile__v{font-size:1rem;font-weight:700;letter-spacing:-.022em;line-height:1.35;margin-bottom:8px}
.ktile__v a:hover{color:var(--g-deep)}
.ktile__n{font-size:.8rem;color:var(--tx2);line-height:1.6}
.karea{background:var(--pap2);border:1px solid var(--line);border-radius:20px;padding:clamp(20px,2.2vw,26px);margin-top:clamp(14px,1.6vw,18px)}

/* mapa cez celú šírku obsahu */
.kmap__head{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-end;justify-content:space-between;margin-bottom:clamp(18px,2.2vw,26px)}
.kmap__head>div{flex:1 1 32rem;max-width:64ch}
.kmap__head .btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.kmap__frame{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line);
 background:var(--pap2);height:clamp(300px,38vw,460px)}
.kmap__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.kmap__frame iframe[hidden]{display:none}
/* vidno len vtedy, keď sa mapa nenačíta */
.kmap__fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;
 font-size:.92rem;font-weight:600;color:var(--tx2);text-align:center;padding:24px}
.kmap__fallback svg{width:20px;height:20px;stroke:var(--g-deep);fill:none;stroke-width:2}
/* Zástupná plocha pred mapou od Googlu — mapa sa načíta až po kliknutí.
   Adresa aj odkaz na navigáciu sú tu dostupné, takže kto mapu nechce,
   o nič neprichádza. */
.kmap__suhlas{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;
 align-items:center;justify-content:center;gap:12px;text-align:center;
 padding:clamp(22px,4vw,44px);background:var(--pap2);
 background-image:linear-gradient(var(--line) 1px,transparent 1px),
  linear-gradient(90deg,var(--line) 1px,transparent 1px);
 background-size:44px 44px;background-position:center}
.kmap__suhlas[hidden]{display:none}
.kmap__suhlas>*{position:relative}
.kmap__suhlas::before{content:'';position:absolute;inset:0;
 background:radial-gradient(ellipse at center,var(--pap2) 38%,rgba(247,245,243,.72) 100%)}
.kmap__suhlas-h{margin:0;display:flex;align-items:center;gap:10px;
 font-weight:700;color:var(--ink)}
.kmap__suhlas-h svg{width:20px;height:20px;stroke:var(--g-deep);fill:none;stroke-width:2}
.kmap__suhlas-x{margin:0;max-width:50ch;font-size:.88rem;line-height:1.6;color:var(--tx2)}
.kmap__suhlas-b{margin-top:2px}
.kmap__suhlas-a{font-size:.8rem;color:var(--tx3);text-underline-offset:3px}

/* fakturačné údaje ako široký pás */
.billrow{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,1.8vw,24px)}
.billrow>div{padding-top:16px;border-top:2px solid var(--line2)}
.billrow__wide{grid-column:1/-1}
.billrow dt{font-size:.62rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--tx3);margin-bottom:7px}
.billrow dd{font-size:.92rem;font-weight:600;letter-spacing:-.018em;color:var(--tx);line-height:1.45}
.billrow__wide dd{font-weight:500;color:var(--tx2);font-size:.86rem}
.aside{position:sticky;top:calc(var(--nav-h) + 20px);background:var(--pap2);border:1px solid var(--line);border-radius:22px;padding:clamp(22px,2.6vw,30px)}
.aside h2{font-size:1.06rem;margin-bottom:14px}
.aside p{font-size:.86rem;color:var(--tx2);line-height:1.7;margin-bottom:18px}
.aside .btn{width:100%}

/* 8. FOOTER ------------------------------------------------------------- */
/* newsletter — vlastný blok navrchu pätičky, aby nekonkuroval hlavnej výzve */
.nl{background:var(--ink2);border-bottom:1px solid rgba(255,255,255,.09);padding:clamp(38px,4.6vw,58px) 0}
.nl__in{display:grid;grid-template-columns:1fr .92fr;gap:clamp(24px,4vw,60px);align-items:center}
.nl__h{font-size:clamp(1.2rem,2.1vw,1.7rem);font-weight:700;letter-spacing:-.032em;color:#fff;line-height:1.2;margin-bottom:10px;text-wrap:balance}
.nl__x{font-size:.88rem;color:rgba(255,255,255,.66);line-height:1.7;max-width:52ch}
.nlform{display:flex;flex-direction:column;gap:12px}
.nlform__row{display:flex;gap:10px}
.nlform input[type="email"]{flex:1;min-width:0;font-family:inherit;font-size:.92rem;color:#fff;
 background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);border-radius:100px;padding:14px 20px;min-height:50px;transition:.2s}
.nlform input[type="email"]::placeholder{color:rgba(255,255,255,.4)}
.nlform input[type="email"]:focus{border-color:var(--g);background:rgba(255,255,255,.12);outline:none}
.nlform .btn{flex-shrink:0}
.nl__consent{display:flex;gap:10px;align-items:flex-start}
.nl__consent input{width:18px;height:18px;flex-shrink:0;margin-top:2px;accent-color:var(--g)}
.nl__consent label{font-size:.76rem;line-height:1.6;color:rgba(255,255,255,.58)}
.nl .fmsg{margin-top:2px}
.nl [data-invalid="true"] input{border-color:var(--err-line-w)}

.ft{background:var(--ink);color:rgba(255,255,255,.6);padding:clamp(54px,7vw,84px) 0 28px}
.ft__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(26px,4vw,52px);padding-bottom:clamp(32px,4.4vw,50px);border-bottom:1px solid rgba(255,255,255,.09)}
.ft__logo img{height:34px;width:auto;margin-bottom:20px}
.ft__hero{font-size:clamp(1.4rem,3vw,2.15rem);font-weight:800;letter-spacing:-.04em;color:#fff;line-height:1.1;max-width:15ch;margin-bottom:24px}
.ft__c{display:flex;align-items:flex-start;gap:11px;margin-bottom:11px}
.ft__c svg{width:16px;height:16px;stroke:var(--g);fill:none;stroke-width:1.9;flex-shrink:0;margin-top:3px}
.ft__c b{display:block;font-size:.61rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.58);font-weight:700;margin-bottom:2px}
.ft__c span{font-size:.83rem;color:rgba(255,255,255,.7);line-height:1.5}
.ft__c a{display:inline-block;padding:4px 0}
.ft__c a:hover{color:var(--g)}
.ft__h{font-size:.63rem;font-weight:800;letter-spacing:.19em;text-transform:uppercase;color:var(--g);margin-bottom:19px}
.ft__l{list-style:none;display:flex;flex-direction:column;gap:11px}
.ft__l a,.ft__l span{font-size:.84rem;color:rgba(255,255,255,.68);line-height:1.6;transition:color .2s}
.ft__l a{display:inline-block;padding:4px 0}
.ft__l a:hover{color:var(--g)}
.ft__so{display:flex;gap:9px;margin-top:22px}
.ft__so a{width:44px;height:44px;border-radius:10px;background:rgba(255,255,255,.06);display:grid;place-items:center;transition:.22s}
.ft__so a:hover{background:var(--g)}
.ft__so svg{width:15px;height:15px;fill:rgba(255,255,255,.7);transition:.22s}
.ft__so a:hover svg{fill:var(--ink)}
.ft__note{margin-top:20px;font-size:.78rem;line-height:1.65;color:rgba(255,255,255,.5)}
.ft__note a{color:var(--g);font-weight:600}
.ft__bt{display:flex;justify-content:space-between;gap:18px;padding-top:24px;font-size:.75rem;color:rgba(255,255,255,.6);flex-wrap:wrap}
.ft__bt a{color:rgba(255,255,255,.72);text-decoration:underline;text-underline-offset:2px;display:inline-block;padding:4px 0}
.ft__bt a:hover{color:var(--g)}

/* 9. PODSTRÁNKA FOTOVOLTIKA --------------------------------------------- */

/* hlavička stránky s výraznejšou fotografiou a tlačidlami */
.phead--lead{padding-bottom:clamp(52px,7vw,88px)}
.phead--lead .phead__img{opacity:.85}
.phead--lead .phead__v{background:
 linear-gradient(100deg,rgba(10,7,5,.86) 0%,rgba(10,7,5,.6) 44%,rgba(10,7,5,.2) 100%),
 linear-gradient(180deg,rgba(10,7,5,.55) 0%,rgba(10,7,5,.1) 34%,rgba(10,7,5,.45) 100%)}
.phead__acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
/* CERTIFIKÁTY ------------------------------------------------------------ */
/* hlavička bez fotografie — stránka je o dokladoch, tak sú v nej vidno doklady */
.phead__in--split{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(30px,4.5vw,64px);align-items:center}
.phead--docs .phead__grid{position:absolute;inset:0;z-index:1;opacity:.5;
 background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px);
 background-size:clamp(44px,5vw,68px) clamp(44px,5vw,68px)}
.phead--docs .phead__v{background:
 radial-gradient(115% 85% at 76% 16%,rgba(255,90,31,.22),transparent 60%),
 linear-gradient(100deg,rgba(12,8,6,.9),rgba(12,8,6,.66))}
/* vejár troch dokladov — všetky v jednej bunke mriežky, rozostupy cez transform */
.dfan{display:grid;place-items:center;min-height:clamp(348px,32vw,466px)}
.dfan__c{grid-area:1/1;position:relative;width:min(276px,84%);background:#FBFAF8;color:var(--tx);
 border:1px solid rgba(0,0,0,.06);border-radius:15px;padding:19px 21px 17px;
 box-shadow:0 34px 64px -26px rgba(0,0,0,.7)}
.dfan__c--1{transform:translate(-16%,-128px) rotate(-6deg)}
.dfan__c--2{transform:rotate(-1deg);z-index:2}
.dfan__c--3{transform:translate(16%,128px) rotate(5deg);z-index:3}
.dfan__hd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}
.dfan__rule{display:block;width:34px;height:3px;border-radius:2px;background:var(--g)}
.dfan__seal{width:29px;height:29px;border-radius:50%;background:var(--g-wash);display:grid;place-items:center}
.dfan__seal svg{width:15px;height:15px;stroke:var(--g-deep);fill:none;stroke-width:1.8}
.dfan__is{font-size:.55rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);margin-bottom:7px}
.dfan__t{font-size:.85rem;font-weight:700;letter-spacing:-.022em;line-height:1.32;margin-bottom:14px;
 display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.64em}
.dfan__m{display:grid;gap:7px;border-top:1px solid var(--line);padding-top:12px}
.dfan__m>div{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.dfan__m dt{font-size:.55rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--tx3)}
.dfan__m dd{font-size:.75rem;font-weight:600}
.dfan__num{font-variant-numeric:tabular-nums;letter-spacing:.05em}

/* schéma toku elektriny */
.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,34px);list-style:none}
.flow__i{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(20px,2.2vw,26px)}
.flow__i::after{content:"";position:absolute;left:100%;top:50%;width:clamp(18px,2.4vw,34px);height:2px;
 background-image:linear-gradient(90deg,var(--g) 55%,transparent 55%);background-size:9px 2px;background-repeat:repeat-x;
 animation:march .7s linear infinite}
.flow__i:last-child::after{display:none}
@keyframes march{to{background-position:9px 0}}
.flow__n{display:inline-flex;align-items:center;gap:9px;font-size:.63rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--g-deep);margin-bottom:16px}
.flow__n i{width:26px;height:26px;border-radius:8px;background:var(--g-wash);display:grid;place-items:center;font-style:normal}
.flow__n svg{width:14px;height:14px;stroke:var(--g-deep);fill:none;stroke-width:2}
.flow__t{font-size:clamp(1.05rem,1.4vw,1.28rem);font-weight:700;letter-spacing:-.026em;margin-bottom:8px}
.flow__x{font-size:.86rem;color:var(--tx2);line-height:1.7}

/* poradie, v akom sa elektrina spotrebuje */
.prio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.7vw,20px);list-style:none;counter-reset:p}
.prio__i{border-radius:20px;padding:clamp(20px,2.2vw,28px);border:1px solid var(--line);background:#fff}
.prio__i:first-child{background:var(--g-wash);border-color:var(--g-wash2)}
.prio__i:last-child{background:var(--pap2)}
.prio__n{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.prio__n b{width:34px;height:34px;border-radius:11px;background:var(--g);color:var(--ink);display:grid;place-items:center;font-size:.86rem;font-weight:800;flex-shrink:0}
.prio__i:nth-child(2) .prio__n b{background:var(--g-wash2);color:var(--g-deep)}
.prio__i:last-child .prio__n b{background:var(--line);color:var(--tx3)}
.prio__n span{font-size:clamp(1rem,1.3vw,1.16rem);font-weight:700;letter-spacing:-.024em}
.prio__x{font-size:.86rem;color:var(--tx2);line-height:1.7}

/* široký záber, ktorý preruší hustú sekciu */
/* ---------------------------------------- POŽIČOVŇA NÁRADIA (homepage) -- */
.rent{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,4vw,56px);align-items:start}
.rent__p{margin:14px 0 0;max-width:52ch;color:var(--tx2);line-height:1.65}
.rent__note{margin:14px 0 0;max-width:52ch;font-size:.86rem;line-height:1.6;color:var(--tx3);
 border-left:2px solid var(--g);padding-left:14px}
/* Logo má biele pozadie, preto biela karta — na sivom podklade by inak
   vznikol okolo neho svetlý obdĺžnik. */
.rent__card{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(16px,2vw,26px);
 margin-top:clamp(22px,2.6vw,30px);background:var(--pap);border:1px solid var(--line);
 border-radius:18px;padding:clamp(16px,2vw,22px)}
.rent__logo{width:auto;height:52px;flex-shrink:0}
.rent__act{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.rent__tel{margin:0;display:inline-flex;align-items:center;gap:7px;font-size:.84rem;font-weight:700;color:var(--tx)}
.rent__tel svg{width:14px;height:14px;stroke:var(--g);fill:none;stroke-width:2}
.rent__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0}
.rent__i{background:var(--pap);border:1px solid var(--line);border-radius:16px;
 padding:clamp(16px,1.8vw,20px);transition:border-color .2s,transform .2s var(--ease)}
.rent__i:hover{border-color:var(--line2);transform:translateY(-2px)}
.rent__ic{width:34px;height:34px;border-radius:10px;background:var(--g-wash2);
 display:grid;place-items:center;margin-bottom:11px}
.rent__ic svg{width:17px;height:17px;stroke:var(--g-deep);fill:none;stroke-width:1.9}
.rent__n{display:block;font-size:.88rem;font-weight:700;color:var(--tx);margin-bottom:4px}
.rent__w{display:block;font-size:.76rem;line-height:1.5;color:var(--tx2)}
/* ------------------------------------------------------------------ BLOG -- */
/* Filter tém */
.bfil{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:clamp(24px,3vw,36px)}
.bfil__b{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:100px;
 border:1px solid var(--line);background:#fff;font-size:.8rem;font-weight:600;color:var(--tx2);transition:.18s}
.bfil__b:hover{border-color:var(--line2);color:var(--tx)}
.bfil__b.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.bfil__n{font-size:.72rem;font-weight:700;opacity:.6}

/* Mriežka článkov */
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.8vw,24px);align-items:stretch}
.bp{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
 border-radius:22px;overflow:hidden;transition:border-color .2s,transform .25s var(--ease)}
/* Odkaz z nadpisu prekryje celú kartu — klikateľná je tak aj fotka a text. */
.bp__t a::after{content:"";position:absolute;inset:0;z-index:1}
/* Rubrika musí zostať klikateľná samostatne, preto nad prekrytím. */
.bp__cat{position:relative;z-index:2}
.bp:hover{border-color:var(--line2);transform:translateY(-3px)}
.bp__ph{display:block;background:var(--pap2);aspect-ratio:4/3;overflow:hidden}
.bp__ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.bp:hover .bp__ph img{transform:scale(1.04)}
.bp__noph{display:grid;place-items:center;width:100%;height:100%;background:var(--g-wash)}
.bp__noph svg{width:34px;height:34px;stroke:var(--g-deep);fill:none;stroke-width:1.6;opacity:.55}
.bp__b{display:flex;flex-direction:column;gap:10px;padding:clamp(18px,2vw,24px);flex:1}
.bp__m{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;font-size:.72rem;color:var(--tx3)}
.bp__cat{font-weight:700;color:var(--g-deep);text-transform:uppercase;letter-spacing:.06em}
.bp__read{margin-left:auto}
.bp__t{margin:0;font-size:clamp(1.02rem,1.5vw,1.18rem);font-weight:700;line-height:1.32;
 letter-spacing:-.02em;color:var(--tx)}
.bp__t a{color:inherit}
.bp:focus-within{border-color:var(--g);box-shadow:0 0 0 3px var(--g-wash2)}
.bp:hover .bp__t a{color:var(--g-deep)}
.bp__x{margin:0;font-size:.85rem;line-height:1.62;color:var(--tx2)}
.bp__go{margin-top:auto;padding-top:4px;font-size:.8rem}

/* Najnovší článok cez celú šírku */
.bp--velka{grid-column:1/-1;flex-direction:row}
.bp--velka .bp__ph{flex:0 0 52%;aspect-ratio:16/10}
.bp--velka .bp__b{justify-content:center;padding:clamp(24px,3vw,40px)}
.bp--velka .bp__t{font-size:clamp(1.3rem,2.4vw,1.85rem);letter-spacing:-.032em}
.bp--velka .bp__x{font-size:.94rem}

/* Prázdny blog */
.bempty{display:flex;flex-direction:column;align-items:flex-start;gap:16px;background:var(--pap2);
 border:1px solid var(--line);border-radius:22px;padding:clamp(26px,3.4vw,44px);max-width:62ch}
.bempty__ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:var(--g-wash2)}
.bempty__ic svg{width:21px;height:21px;stroke:var(--g-deep);fill:none;stroke-width:1.8}

/* Stránkovanie */
.bpag{margin-top:clamp(30px,4vw,48px)}
.bpag .nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bpag .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;
 padding:0 14px;border-radius:100px;border:1px solid var(--line);background:#fff;
 font-size:.82rem;font-weight:600;color:var(--tx2);transition:.18s}
.bpag .page-numbers:hover{border-color:var(--line2);color:var(--tx)}
.bpag .page-numbers.current{background:var(--ink);border-color:var(--ink);color:#fff}
.bpag .page-numbers.dots{border-color:transparent;background:none}

/* Obrázky v článku */
.prose figure{margin-block:clamp(26px,3vw,38px)}
.prose img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--line)}
.prose figcaption{margin-top:10px;font-size:.78rem;line-height:1.5;color:var(--tx3);text-align:left}
/* Otázky v článku majú byť odlíšené — Google si z nich berie rozbaľovacie odpovede. */
.prose h3{font-size:clamp(1.02rem,1.6vw,1.18rem);color:var(--tx);margin-top:1.7em;letter-spacing:-.018em}

/* Obsah článku */
.toc{background:var(--pap2);border:1px solid var(--line);border-radius:18px;
 padding:clamp(18px,2.2vw,26px);margin-bottom:clamp(26px,3.2vw,38px)}
.toc__h{margin:0 0 12px;font-size:.74rem;font-weight:800;letter-spacing:.09em;
 text-transform:uppercase;color:var(--tx3)}
.toc__l{margin:0;padding-left:1.3em;display:flex;flex-direction:column;gap:8px}
.toc__l li{font-size:.88rem;line-height:1.45;color:var(--tx3)}
.toc__l a{color:var(--tx2);text-underline-offset:3px}
.toc__l a:hover{color:var(--g-deep);text-decoration:underline}
/* Nadpis, na ktorý sa preskočí, nesmie skončiť pod lepiacim menu. */
.prose h2[id]{scroll-margin-top:calc(var(--nav-h) + 20px)}

/* Článok */
/* Hlavička článku a výpisu ukazuje fotografiu výraznejšie než služobné
   stránky — tam ide o text, tu je obrázok súčasťou dojmu z článku. Prekrytie
   preto sťahujeme, ale nie úplne: biely nadpis musí zostať čitateľný aj nad
   svetlou fotografiou. */
.phead--clanok .phead__img,.phead--vypis .phead__img{opacity:.62}
.phead--clanok .phead__v,.phead--vypis .phead__v{
 background:linear-gradient(100deg,rgba(12,8,6,.86),rgba(12,8,6,.48))}
.phead--clanok h1,.phead--vypis h1{text-shadow:0 2px 24px rgba(12,8,6,.45)}
.phead--clanok .lede,.phead--vypis .lede{text-shadow:0 1px 14px rgba(12,8,6,.5)}
.phead--clanok h1{max-width:24ch}
.bmeta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 16px;
 font-size:.76rem;color:rgba(255,255,255,.72)}
.bmeta__cat{font-weight:700;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);
 border-radius:100px;padding:5px 12px;text-transform:uppercase;letter-spacing:.06em;font-size:.7rem}
.bwrap{max-width:78ch;margin-inline:auto}
.bwrap .prose{max-width:none}
.bcta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
 margin-top:clamp(34px,4.4vw,54px);padding:clamp(22px,2.8vw,32px);background:var(--pap2);
 border:1px solid var(--line);border-radius:22px}
.bcta h2{margin:0 0 6px}
.bcta p{margin:0;font-size:.88rem;line-height:1.6;color:var(--tx2);max-width:52ch}
.bcta__acts{display:flex;flex-wrap:wrap;gap:10px}
.bcta__acts .btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}

.strip-ph{border-radius:22px;overflow:hidden;background:var(--pap2);margin:clamp(30px,4vw,44px) 0 0}
.strip-ph img{width:100%;aspect-ratio:16/5;object-fit:cover}

/* postup so šiestimi krokmi — 3 + 3 sa číta lepšie než 4 + 2 */
.steps--3{grid-template-columns:repeat(3,1fr)}

/* čo je v cene — fotografia vedľa zoznamu */
.cmsplit{display:grid;grid-template-columns:.34fr .66fr;gap:clamp(18px,2.4vw,30px);align-items:start}
.cmsplit__ph{border-radius:22px;overflow:hidden;background:var(--pap2);aspect-ratio:3/4;position:sticky;top:calc(var(--nav-h) + 24px)}
.cmsplit__ph img{width:100%;height:100%;object-fit:cover}
.comp{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.7vw,22px)}
.comp__i{display:flex;gap:16px;padding:clamp(18px,2vw,24px);border:1px solid var(--line);border-radius:18px;background:#fff;transition:.3s var(--ease)}
.comp__i:hover{border-color:var(--g);transform:translateY(-3px)}
.comp__ic{width:44px;height:44px;border-radius:13px;background:var(--g-wash);display:grid;place-items:center;flex-shrink:0}
.comp__ic svg{width:20px;height:20px;stroke:var(--g-deep);fill:none;stroke-width:1.9}
.comp__t{font-size:.98rem;font-weight:700;letter-spacing:-.022em;margin-bottom:6px}
.comp__x{font-size:.83rem;color:var(--tx2);line-height:1.65}
/* V úzkom stĺpci vedľa fotografie by dva stĺpce kariet boli pritesné. */
.evgrid .comp{grid-template-columns:1fr}

/* elektroinštalácie — mriežka služieb s ikonou namiesto fotografie */
.elgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.7vw,22px)}
.elc{background:#fff;border:1px solid var(--line);border-radius:22px;
 padding:clamp(22px,2.4vw,30px);transition:transform .34s var(--ease),border-color .34s var(--ease),box-shadow .34s var(--ease)}
.elc:hover{transform:translateY(-5px);border-color:var(--g);box-shadow:0 28px 60px -30px rgba(19,17,16,.22)}
.elc__ic{width:46px;height:46px;border-radius:14px;background:var(--g-wash);display:grid;place-items:center;margin-bottom:18px}
.elc__ic svg{width:21px;height:21px;stroke:var(--g-deep);fill:none;stroke-width:1.9}
.elc__t{font-size:clamp(1rem,1.3vw,1.14rem);font-weight:700;letter-spacing:-.024em;margin-bottom:9px}
.elc__x{font-size:.85rem;color:var(--tx2);line-height:1.72}
.elgrid--4{grid-template-columns:repeat(4,1fr)}
/* karta s odkazom na spodku — odkazy musia byť naprieč mriežkou v jednom riadku */
.elc--act{display:flex;flex-direction:column}
.elc--act .go{margin-top:auto;padding-top:16px}
/* filter dokladov */
.cfil{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(20px,2.4vw,28px)}
.cfil__b{display:inline-flex;align-items:center;gap:9px;cursor:pointer;font:inherit;
 border:1.5px solid var(--line2);background:#fff;border-radius:100px;padding:11px 18px;
 font-size:.78rem;font-weight:700;letter-spacing:-.012em;color:var(--tx2);
 transition:border-color .24s var(--ease),color .24s var(--ease),background .24s var(--ease)}
.cfil__n{font-size:.65rem;font-weight:800;font-variant-numeric:tabular-nums;border-radius:100px;
 background:var(--pap2);color:var(--tx3);padding:2px 8px;min-width:23px;text-align:center;
 transition:background .24s var(--ease),color .24s var(--ease)}
.cfil__b:hover{border-color:var(--g);color:var(--g-deep)}
.cfil__b:hover .cfil__n{background:var(--g-wash);color:var(--g-deep)}
.cfil__b.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.cfil__b.is-on .cfil__n{background:rgba(255,255,255,.17);color:#fff}
/* zoznam dokladov */
.cfgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.7vw,20px)}
.cf{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(20px,2.2vw,26px);
 display:flex;flex-direction:column;transition:.3s var(--ease)}
.cf:hover{border-color:var(--g);transform:translateY(-4px);box-shadow:0 26px 56px -30px rgba(19,17,16,.22)}
.cf[hidden]{display:none}
.cf__hd{display:flex;align-items:center;gap:11px;margin-bottom:16px}
.cf__seal{width:38px;height:38px;border-radius:11px;background:var(--g-wash);display:grid;place-items:center;flex-shrink:0}
.cf__seal svg{width:19px;height:19px;stroke:var(--g-deep);fill:none;stroke-width:1.8}
.cf__seal--img{overflow:hidden;background:#fff;border:1px solid var(--line);width:52px;height:52px}
.cf__seal--img img{width:100%;height:100%;object-fit:cover;object-position:top}

/* --- Posuvný pás so skenmi dokladov --------------------------------------- */
/* Karta má tvar listu A4, aby sa doklad zobrazil celý a nemusel sa orezávať. */
.carousel--cert .carousel__i{flex:0 0 clamp(240px,26vw,340px)}
.cfsl{margin:0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
 display:flex;flex-direction:column;height:100%}
.cfsl__img{position:relative;display:block;background:#fff;border-bottom:1px solid var(--line)}
.cfsl__img img{display:block;width:100%;height:auto;aspect-ratio:1/1.414;object-fit:contain;
 transition:transform .5s var(--ease)}
.cfsl__img:hover img{transform:scale(1.03)}
.cfsl__zoom{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:6px;
 font-size:.72rem;font-weight:700;color:#fff;background:rgba(19,17,16,.74);backdrop-filter:blur(6px);
 border-radius:100px;padding:7px 12px;opacity:0;transform:translateY(4px);transition:.22s var(--ease)}
.cfsl__zoom svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2}
.cfsl__img:hover .cfsl__zoom,.cfsl__img:focus-visible .cfsl__zoom{opacity:1;transform:none}
/* Na dotykových zariadeniach sa neprechádza myšou — tam nech je vidno vždy. */
@media (hover:none){.cfsl__zoom{opacity:1;transform:none}}
.cfsl__cap{padding:clamp(14px,1.6vw,18px);display:flex;flex-direction:column;gap:6px;flex:1}
.cfsl__t{margin:0;font-size:.86rem;font-weight:700;color:var(--tx);line-height:1.35}
.cfsl__m{margin:0;font-size:.74rem;line-height:1.5;color:var(--tx2)}
.cfsl__v{display:block;font-weight:600;color:var(--tx3)}
.cfsl__pdf{margin-top:auto;padding-top:8px;font-size:.78rem}
.cf__g{font-size:.57rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);line-height:1.3}
.cf__st{margin-left:auto;display:inline-flex;align-items:center;gap:7px;flex-shrink:0;
 font-size:.62rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
 padding:5px 11px;border-radius:100px}
.cf__dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.cf__st--ok{background:var(--ok-bg);color:var(--ok)}
.cf__st--soon{background:var(--warn-bg);color:var(--warn)}
.cf__st--perm{background:var(--pap2);color:var(--tx3)}
.cf__t{font-size:clamp(.96rem,1.2vw,1.06rem);font-weight:700;letter-spacing:-.024em;line-height:1.3;
 margin-bottom:16px;text-wrap:balance}
.cf__m{display:grid;gap:8px;padding-bottom:15px;border-bottom:1px solid var(--line);margin-bottom:14px}
.cf__m>div{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.cf__m dt{font-size:.57rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--tx3);flex-shrink:0}
.cf__m dd{font-size:.79rem;font-weight:600;text-align:right;line-height:1.45}
.cf__num{font-variant-numeric:tabular-nums;letter-spacing:.05em}
.cf__pdf{margin:14px 0 0}
.cf__x{font-size:.83rem;color:var(--tx2);line-height:1.72;margin-top:auto}
.cf-empty{text-align:center;padding:44px 0;color:var(--tx3);font-size:.9rem}
.reg__more{margin-top:clamp(20px,2.4vw,28px)}
.cf-note{display:flex;align-items:flex-start;gap:11px;margin-top:clamp(20px,2.4vw,28px);
 font-size:.82rem;color:var(--tx2);line-height:1.7;max-width:78ch}
.cf-note svg{width:17px;height:17px;stroke:var(--g-deep);fill:none;stroke-width:1.9;margin-top:3px}
/* hláška pre prihláseného redaktora, kým sú v zozname ukážkové doklady */
.cf-warn{display:flex;align-items:flex-start;gap:12px;background:var(--warn-bg);
 border:1px solid var(--warn-line);border-left:4px solid var(--warn);border-radius:14px;
 padding:16px 20px;font-size:.85rem;line-height:1.7;color:#5C3A00}
.cf-warn svg{width:18px;height:18px;stroke:var(--warn);fill:none;stroke-width:2;margin-top:4px}
.cf-warn code{background:rgba(0,0,0,.07);padding:1px 6px;border-radius:5px;font-size:.9em}
/* ikona v riadku zoznamu — riadok je flex, preto sa musí brániť zmršteniu */
.rzrow>svg{width:18px;height:18px;stroke:var(--g-lo);fill:none;stroke-width:2.2;flex-shrink:0}

/* heatflow — skladba podlahy vrstvu po vrstve
   Pásik vľavo nesie hrúbku vrstvy opticky; text ju nesie doslova, aby
   informácia nezávisela od toho, či človek vidí. */
.layers{list-style:none;background:#fff;border:1px solid var(--line);border-radius:24px;
 padding:clamp(20px,2.4vw,28px);display:flex;flex-direction:column}
.layer{display:flex;align-items:center;gap:clamp(14px,1.8vw,22px);padding:14px 0;border-bottom:1px solid var(--line)}
.layer:last-child{border-bottom:0}
.layer__bar{flex:0 0 clamp(56px,7vw,92px);height:14px;border-radius:4px;
 background:repeating-linear-gradient(45deg,var(--pap2) 0 6px,#EFEBE7 6px 12px);
 border:1px solid var(--line2)}
.layer__b{flex:1;min-width:0}
.layer__t{display:block;font-size:.92rem;font-weight:700;letter-spacing:-.022em;line-height:1.3}
.layer__x{display:block;font-size:.76rem;color:var(--tx3);margin-top:3px}
.layer__d{font-size:.8rem;font-weight:800;color:var(--tx2);white-space:nowrap;font-variant-numeric:tabular-nums}
.layer--hi .layer__bar{height:8px;background:linear-gradient(90deg,var(--g-hi),var(--g));border-color:var(--g-lo)}
.layer--hi .layer__t{color:var(--g-deep)}
.layer--hi .layer__d{color:var(--g-deep)}

/* heatflow — porovnávacia tabuľka */
.ctab-w{overflow-x:auto;border:1px solid var(--line);border-radius:24px;background:#fff}
.ctab{width:100%;min-width:44rem;border-collapse:collapse;font-size:.86rem}
.ctab th,.ctab td{padding:15px clamp(14px,1.6vw,20px);text-align:left;border-bottom:1px solid var(--line)}
.ctab thead th{font-size:.68rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
 color:var(--tx3);border-bottom:1px solid var(--line2);vertical-align:bottom}
.ctab tbody th{font-weight:600;color:var(--tx);letter-spacing:-.018em}
.ctab td{color:var(--tx2)}
.ctab tbody tr:last-child th,.ctab tbody tr:last-child td{border-bottom:0}
/* zvýraznený stĺpec — vlastná služba */
.ctab__hi{background:var(--g-wash)}
.ctab thead .ctab__hi{color:var(--g-deep);border-bottom-color:var(--g-wash2)}
.ctab tbody .ctab__hi{color:var(--g-deep);font-weight:700}
.ctab tr:first-child .ctab__hi{border-top-left-radius:14px;border-top-right-radius:14px}

/* heatflow — karta s fotografiou v posuvnom páse */
.ucard{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--line);
 border-radius:22px;overflow:hidden;transition:transform .34s var(--ease),border-color .34s var(--ease)}
.ucard:hover{transform:translateY(-5px);border-color:var(--g)}
.ucard__ph{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--pap2)}
.ucard__ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.ucard:hover .ucard__ph img{transform:scale(1.06)}
.ucard__b{display:block;padding:clamp(18px,2vw,24px)}
.ucard__t{font-size:1.02rem;font-weight:700;letter-spacing:-.024em;margin-bottom:8px}
.ucard__x{font-size:.83rem;color:var(--tx2);line-height:1.68}
/* širšie karty — fotografia potrebuje viac miesta než samotný text */
.carousel--wide .carousel__i{flex:0 0 clamp(272px,29vw,382px)}

/* poznámka na tmavom podklade */
.hfnote{margin-top:clamp(22px,2.6vw,30px);padding-left:16px;border-left:2px solid var(--g);
 font-size:.86rem;line-height:1.75;color:rgba(255,255,255,.72);max-width:74ch}

/* DOTÁCIE ---------------------------------------------------------------- */

/* zápis v registri SIEA — vrátane toho, čo v ňom zaškrtnuté nemáme */
.reg{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;
 box-shadow:0 28px 64px -34px rgba(19,17,16,.2)}
.reg__hd{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
 padding:clamp(15px,1.8vw,19px) clamp(20px,2.6vw,30px);background:var(--ink);
 font-size:.64rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.reg__hd a{color:var(--g);text-decoration:none;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.reg__hd a:hover{color:#fff}
.reg__in{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(22px,3vw,44px);
 padding:clamp(24px,3vw,36px) clamp(20px,2.6vw,30px)}

.reg__co{display:grid;gap:16px;align-content:start}
.reg__co dt{font-size:.6rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--tx3);margin-bottom:5px}
.reg__co dd{font-size:.94rem;color:var(--tx);letter-spacing:-.018em}
.reg__co dd b{font-weight:700}
.reg__num{font-variant-numeric:tabular-nums;letter-spacing:.06em}

.reg__caps{list-style:none;display:grid;gap:9px;align-content:start}
.reg__cap{display:flex;align-items:center;gap:13px;padding:13px 16px;border-radius:14px;
 background:var(--pap2);border:1px solid transparent}
.reg__cap.is-on{background:var(--g-wash);border-color:var(--g-wash2)}
.reg__mark{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;
 background:var(--line);color:var(--tx3)}
.reg__mark svg{width:14px;height:14px;stroke-width:2.8}
.reg__cap.is-on .reg__mark{background:var(--g);color:#fff}
.reg__capt{font-size:.9rem;font-weight:600;letter-spacing:-.02em}
.reg__cap:not(.is-on) .reg__capt{color:var(--tx2)}
.reg__caps-s{margin-left:auto;font-size:.66rem;font-weight:700;letter-spacing:.06em;color:var(--tx3);white-space:nowrap}
.reg__cap.is-on .reg__caps-s{color:var(--g-deep)}
.reg__ft{padding:0 clamp(20px,2.6vw,30px) clamp(22px,2.6vw,28px);font-size:.79rem;color:var(--tx3);line-height:1.7;max-width:82ch}

/* karta programu podpory — suma nesie kartu, text ju vysvetľuje */
.pgc__w{font-size:.72rem;font-weight:700;letter-spacing:.04em;color:var(--tx3);margin:-4px 0 16px}
.pgc__m{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin-bottom:4px}
.pgc__m span{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3)}
.pgc__m b{font-size:clamp(1.5rem,2.4vw,1.95rem);font-weight:800;letter-spacing:-.045em;line-height:1;color:var(--g-deep)}
.pgc__m em{font-style:normal;font-size:.7rem;font-weight:600;color:var(--tx3);flex-basis:100%}
.pgc__r{font-size:.8rem;font-weight:600;color:var(--tx2);padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--line)}
.pgc__n{display:flex;gap:9px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);
 font-size:.78rem;font-weight:600;color:var(--g-deep);line-height:1.55}
.pgc__n svg{width:15px;height:15px;stroke:var(--g);fill:none;stroke-width:2.8;flex-shrink:0;margin-top:3px}

/* prepínač programu v kalkulačke */
.kmode{display:flex;gap:6px;padding:5px;background:var(--pap2);border-radius:100px;margin-bottom:14px;flex-wrap:wrap}
.kmode__b{flex:1 1 auto;min-width:0;border:0;cursor:pointer;border-radius:100px;padding:10px 12px;background:transparent;
 font:inherit;font-size:.72rem;font-weight:700;letter-spacing:-.01em;color:var(--tx2);
 transition:background .25s var(--ease),color .25s var(--ease)}
.kmode__b:hover{color:var(--tx)}
.kmode__b.is-on{background:var(--ink);color:#fff}
.kmode__x{display:none;font-size:.76rem;color:var(--tx2);line-height:1.65;margin-bottom:24px}
.kmode__x.is-on{display:block}
.kfield + .kfield{margin-top:22px}
.kwhy{display:flex;gap:9px;font-size:.78rem;font-weight:600;color:var(--g-deep);line-height:1.6;
 background:var(--g-wash);border-radius:14px;padding:14px 16px;margin:0 0 20px}
/* O NÁS — míľniky, ľudia, sesterská firma ------------------------------- */
/* príbeh — nadpis vľavo drží krok so začiatkom textu, nie s jeho spodkom */
.stx{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(26px,4.6vw,68px);align-items:start}
.stx__h{position:sticky;top:calc(var(--nav-h) + 28px)}
.stx__t{display:grid;gap:clamp(15px,1.7vw,19px);max-width:68ch}
.stx__t .lede{margin:0}

.tlwrap{display:grid;grid-template-columns:.38fr .62fr;gap:clamp(24px,3.4vw,52px);align-items:start;
 margin-top:clamp(34px,4vw,52px)}
.tlwrap__ph{border-radius:22px;overflow:hidden;background:var(--pap2);aspect-ratio:3/4;
 position:sticky;top:calc(var(--nav-h) + 24px)}
.tlwrap__ph img{width:100%;height:100%;object-fit:cover}

/* časová os — zvislá linka s bodmi, značka nemusí byť rok */
.tline{list-style:none;position:relative;padding-left:clamp(78px,9vw,116px)}
.tline::before{content:"";position:absolute;left:clamp(66px,7.6vw,98px);top:8px;bottom:8px;
 width:2px;background:linear-gradient(180deg,var(--g),var(--g-wash2))}
.tl{position:relative;padding-bottom:clamp(24px,3vw,34px)}
.tl:last-child{padding-bottom:0}
.tl::before{content:"";position:absolute;left:calc(clamp(66px,7.6vw,98px) - clamp(78px,9vw,116px) - 4px);
 top:7px;width:11px;height:11px;border-radius:50%;background:var(--g);
 box-shadow:0 0 0 4px var(--pap)}
.tl__y{position:absolute;left:calc(0px - clamp(78px,9vw,116px));top:4px;
 width:clamp(60px,7vw,90px);text-align:right;
 font-size:.76rem;font-weight:800;letter-spacing:-.01em;color:var(--g-deep);line-height:1.3}
.tl__b{display:block}
.tl__t{display:block;font-size:1.02rem;font-weight:700;letter-spacing:-.024em;margin-bottom:7px}
.tl__x{display:block;font-size:.86rem;color:var(--tx2);line-height:1.72}

/* široká fotografia pod hlavičkou */
.wideph{position:relative;border-radius:24px;overflow:hidden;background:var(--pap2)}
.wideph img{width:100%;height:clamp(240px,34vw,460px);object-fit:cover;display:block}
.wideph__c{position:absolute;left:0;right:0;bottom:0;
 padding:clamp(34px,5vw,56px) clamp(18px,2.4vw,28px) clamp(16px,2vw,22px);
 font-size:.79rem;font-weight:600;color:#fff;letter-spacing:-.01em;
 background:linear-gradient(180deg,rgba(10,7,5,0),rgba(10,7,5,.72))}

/* sesterská firma — jeden riadok, nie celá sekcia */
.sister{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;
 background:#fff;border:1px solid var(--line);border-radius:20px;
 padding:clamp(20px,2.2vw,26px);margin-bottom:clamp(30px,3.6vw,44px)}
.sister>div{flex:1 1 28rem;max-width:66ch}

/* LOXONE — interaktívny dom ---------------------------------------------
   Stavy nesie atribút data-scene na <svg>; jednotlivé miestnosti dostávajú
   premenné --light, --blind a --temp zo skriptu. Bez skriptu ostane
   východiskový scenár a všetky popisy sú aj tak v značkách. */
.hsim{background:var(--ink);border-radius:26px;padding:clamp(18px,2.4vw,28px);color:#fff}
.hsim__bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(18px,2.2vw,24px)}
.hsim__btn{flex:1 1 auto;min-height:44px;display:flex;flex-direction:column;align-items:flex-start;
 gap:2px;padding:10px 16px;border-radius:100px;border:1px solid rgba(255,255,255,.16);
 background:rgba(255,255,255,.05);color:#fff;cursor:pointer;transition:.24s var(--ease);text-align:left}
.hsim__btn:hover{border-color:var(--g);background:rgba(255,90,31,.12)}
.hsim__btn.is-on{background:var(--g);border-color:var(--g);color:var(--ink)}
.hsim__btn-t{font-size:.8rem;font-weight:700;letter-spacing:-.018em;white-space:nowrap}
.hsim__btn-c{font-size:.66rem;font-weight:600;opacity:.66;font-variant-numeric:tabular-nums}

.hsim__stage{display:grid;grid-template-columns:1.75fr 1fr;gap:clamp(16px,2vw,26px);align-items:stretch}
.hs{width:100%;height:auto;display:block;border-radius:18px;overflow:hidden}

/* obloha — tmavne podľa dennej doby */
.hs__sky{fill:#1B1614;transition:fill 1.1s var(--ease)}
.hs[data-scene="rano"] .hs__sky{fill:#2A2119}
.hs[data-scene="prebytok"] .hs__sky{fill:#3A2A1C}
.hs[data-scene="odchod"] .hs__sky{fill:#302520}
.hs__sun{fill:#FFB27A;opacity:0;transition:opacity 1.1s var(--ease),fill .8s var(--ease)}
.hs[data-scene="rano"] .hs__sun{opacity:.5}
.hs[data-scene="odchod"] .hs__sun{opacity:.72}
.hs[data-scene="prebytok"] .hs__sun{opacity:1;fill:#FFD08A}

.hs__roof{fill:#2C2521;stroke:rgba(255,255,255,.14);stroke-width:1.5}
.hs__body{fill:#221C19;stroke:rgba(255,255,255,.12);stroke-width:1.5}
.hs__ground{fill:rgba(255,255,255,.07)}

/* fotovoltika na streche — pri prebytku sa rozžiari */
.hs__pv-p{fill:#1A2A38;stroke:rgba(255,255,255,.2);stroke-width:1;transition:fill .9s var(--ease)}
.hs[data-scene="prebytok"] .hs__pv-p{fill:#2E6FA8}
.hs[data-scene="rano"] .hs__pv-p{fill:#20364A}

/* miestnosti */
.hs__floorplan{fill:rgba(255,255,255,.045);stroke:rgba(255,255,255,.1);stroke-width:1.2}
.hs__glow{fill:var(--g-hi);opacity:calc(var(--light,0) * .38);
 filter:blur(13px);transition:opacity .7s var(--ease)}
.hs__bulb{fill:#FFF0E4;opacity:calc(.14 + var(--light,0) * .86);transition:opacity .7s var(--ease)}
.hs__win{fill:#0E1A24;stroke:rgba(255,255,255,.16);stroke-width:1}
/* žalúzia sa spúšťa mierkou — 0 znamená vytiahnutá, 1 celkom dole */
.hs__blind{fill:#584C44;transform:scaleY(var(--blind,0));transition:transform .8s var(--ease)}
.hs__name{fill:rgba(255,255,255,.62);font-size:11.5px;font-weight:600;font-family:var(--f)}
.hs__temp{fill:var(--g-hi);font-size:12.5px;font-weight:800;font-family:var(--f);
 font-variant-numeric:tabular-nums}

/* garáž a nabíjanie */
.hs__car{fill:#332B26;stroke:rgba(255,255,255,.18);stroke-width:1.2}
.hs__wheel{fill:#171310;stroke:rgba(255,255,255,.2);stroke-width:1}
.hs__wallbox{fill:#2A2320;stroke:rgba(255,255,255,.2);stroke-width:1.2;transition:fill .6s var(--ease),stroke .6s var(--ease)}
.hs[data-scene="prebytok"] .hs__wallbox{fill:var(--g);stroke:var(--g-hi)}

/* stráženie — odznak sa objaví len v scenároch, kde je alarm zapnutý */
.hs__alarm{opacity:0;transition:opacity .5s var(--ease)}
.hs[data-scene="odchod"] .hs__alarm,
.hs[data-scene="noc"] .hs__alarm,
.hs[data-scene="dovolenka"] .hs__alarm{opacity:1}
.hs__alarm-bg{fill:rgba(255,90,31,.14);stroke:var(--g);stroke-width:1.2}
.hs__alarm-d{fill:var(--g)}
.hs__alarm-t{fill:var(--g-hi);font-size:12px;font-weight:800;font-family:var(--f);letter-spacing:.04em}

/* tok energie z panelov k autu */
.hs__flow{stroke:var(--g);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:7 13;opacity:0;
 transition:opacity .6s var(--ease)}
.hs[data-scene="prebytok"] .hs__flow{opacity:.9;animation:hsflow 1.1s linear infinite}
@keyframes hsflow{to{stroke-dashoffset:-40}}

/* popisný panel vedľa domu */
.hsim__panel{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
 border-radius:18px;padding:clamp(18px,2.2vw,26px);display:flex;align-items:center}
.hsim__desc{display:none}
.hsim__desc.is-on{display:block}
.hsim__clock{display:flex;align-items:center;gap:9px;margin-bottom:12px;
 font-size:.68rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--g)}
.hsim__clock svg{width:14px;height:14px;stroke:var(--g);fill:none;stroke-width:2}
.hsim__clock b{color:rgba(255,255,255,.55);font-weight:700}
.hsim__x{font-size:.9rem;line-height:1.8;color:rgba(255,255,255,.82)}
.hsim__note{margin-top:clamp(16px,2vw,22px);font-size:.75rem;line-height:1.65;
 color:rgba(255,255,255,.5);max-width:80ch}

/* cenník zostáv */
.price{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px);align-items:stretch}
.pc{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(22px,2.3vw,28px);display:flex;flex-direction:column;transition:.32s var(--ease)}
.pc:hover{border-color:var(--g);transform:translateY(-5px);box-shadow:0 30px 60px -30px rgba(19,17,16,.24)}
.pc--hi{border-color:var(--g);border-width:2px;box-shadow:0 30px 60px -30px rgba(19,17,16,.26)}
.pc__tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--g);color:var(--ink);font-size:.62rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;padding:6px 14px;border-radius:100px;white-space:nowrap}
.pc__kwp{font-size:clamp(1.7rem,2.4vw,2.15rem);font-weight:800;letter-spacing:-.045em;line-height:1;margin-bottom:6px}
.pc__who{font-size:.78rem;color:var(--tx3);line-height:1.5;margin-bottom:20px;min-height:2.2em}
.pc__list{list-style:none;display:flex;flex-direction:column;gap:10px;padding-top:18px;border-top:1px solid var(--line);margin-bottom:20px}
.pc__list li{display:flex;justify-content:space-between;gap:12px;font-size:.83rem;color:var(--tx2)}
.pc__list b{font-weight:700;color:var(--tx);text-align:right;font-variant-numeric:tabular-nums}
.pc__foot{margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}
.pc__from{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);display:block;margin-bottom:4px}
.pc__price{font-size:1.32rem;font-weight:800;letter-spacing:-.036em;font-variant-numeric:tabular-nums}
.pc__after{display:block;margin-top:10px;font-size:.82rem;color:var(--g-deep);font-weight:700}
.pc__after em{font-style:normal;font-weight:500;color:var(--tx2)}
.pc .btn{width:100%;margin-top:18px}
.pricenote{font-size:.78rem;color:var(--tx3);line-height:1.7;margin-top:26px;max-width:76ch}

/* porovnanie vlastnej spotreby */
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px);align-items:end;
 background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(24px,3vw,36px)}
.cmp__i{text-align:center}
.cmp__v{font-size:clamp(2rem,3.4vw,3rem);font-weight:800;letter-spacing:-.05em;line-height:1;margin-bottom:14px;font-variant-numeric:tabular-nums}
.cmp__bar{height:clamp(120px,16vw,190px);border-radius:14px;background:var(--pap2);border:1px solid var(--line);display:flex;align-items:flex-end;overflow:hidden}
.cmp__fill{width:100%;border-radius:13px;background:#BDB3AA;height:var(--v,40%);transition:height 1.1s var(--ease)}
.js-motion .cmp__fill{height:0}
.js-motion .is-in .cmp__fill,.js-motion .cmp.is-in .cmp__fill{height:var(--v,40%)}
.cmp__i--hi .cmp__fill{background:linear-gradient(180deg,var(--g-hi),var(--g))}
.cmp__i--hi .cmp__v{color:var(--g-deep)}
.cmp__l{font-size:.88rem;font-weight:700;letter-spacing:-.02em;margin-top:16px}
.cmp__x{font-size:.76rem;color:var(--tx3);margin-top:4px;line-height:1.5}

/* elektromobil — rebríček nákladov na 100 km */
.evgrid{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(24px,3.4vw,52px);align-items:start}
.evgrid__ph{border-radius:22px;overflow:hidden;background:var(--pap2);aspect-ratio:4/3;
 position:sticky;top:calc(var(--nav-h) + 24px)}
.evgrid__ph img{width:100%;height:100%;object-fit:cover}
.ladder{background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(22px,2.6vw,32px);margin-top:clamp(24px,3vw,34px)}
.ladder__h{font-size:.63rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--g-deep);
 padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:20px}
.ladder__r{display:grid;grid-template-columns:1fr auto;gap:6px 16px;align-items:center;margin-bottom:18px}
.ladder__r:last-of-type{margin-bottom:0}
.ladder__l{font-size:.86rem;color:var(--tx2);line-height:1.4}
.ladder__v{font-size:1.05rem;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.ladder__bar{grid-column:1/-1;height:12px;border-radius:8px;background:var(--pap2);overflow:hidden}
.ladder__fill{display:block;height:100%;border-radius:8px;background:var(--line2);width:var(--v,50%);
 transition:width 1.1s var(--ease)}
.js-motion .ladder__fill{width:0}
.js-motion .is-in .ladder__fill{width:var(--v,50%)}
.ladder__r--best .ladder__fill{background:linear-gradient(90deg,var(--g-hi),var(--g))}
.ladder__r--best .ladder__v{color:var(--g-deep)}
.ladder__r--best .ladder__l{color:var(--tx);font-weight:600}
.laddernote{font-size:.76rem;color:var(--tx3);line-height:1.7;margin-top:20px}

/* posuvný pás kariet, ktorý presahuje mimo obrazovku */
.carousel{--edge:max(var(--pad),(100% - var(--w))/2 + var(--pad));position:relative}
.carousel__track{display:flex;gap:clamp(14px,1.6vw,20px);list-style:none;overflow-x:auto;overscroll-behavior-x:contain;
 scroll-snap-type:x mandatory;scroll-padding-inline:var(--edge);
 padding:4px var(--edge) 6px;scrollbar-width:none;-ms-overflow-style:none}
.carousel__track::-webkit-scrollbar{display:none}
.carousel__i{flex:0 0 clamp(258px,25vw,330px);scroll-snap-align:start}
.carousel__track:focus-visible{outline:2px solid var(--g-lo);outline-offset:-2px;border-radius:12px}
/* ovládanie šípkami */
.cnav{display:flex;gap:8px}
.cnav button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line2);background:#fff;
 color:var(--tx);display:grid;place-items:center;cursor:pointer;transition:.22s var(--ease)}
.cnav button:hover:not([disabled]){border-color:var(--g);background:var(--g-wash);color:var(--g-deep)}
.cnav button[disabled]{opacity:.35;cursor:default}
.cnav svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2}
/* karta benefitu */
.bcard{height:100%;background:#fff;border:1px solid var(--line);border-radius:22px;
 padding:clamp(20px,2.2vw,26px);display:flex;flex-direction:column;transition:.3s var(--ease)}
.bcard:hover{border-color:var(--g);transform:translateY(-4px);box-shadow:0 26px 52px -26px rgba(19,17,16,.22)}
.bcard__ic{width:44px;height:44px;border-radius:13px;background:var(--g-wash);display:grid;place-items:center;margin-bottom:18px}
.bcard__ic svg{width:20px;height:20px;stroke:var(--g-deep);fill:none;stroke-width:1.9}
.bcard__t{font-size:1.02rem;font-weight:700;letter-spacing:-.024em;margin-bottom:10px}
.bcard__x{font-size:.85rem;color:var(--tx2);line-height:1.72}

/* galéria z priebehu montáže */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,18px);list-style:none}
.gal__i figure{margin:0}
.gal__ph{display:block;border-radius:18px;overflow:hidden;background:var(--pap2)}
.gal__ph img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .7s var(--ease)}
.gal__i:hover .gal__ph img{transform:scale(1.05)}
.gal__i figcaption{display:flex;align-items:center;gap:10px;padding:14px 4px 0;font-size:.82rem;color:var(--tx2);line-height:1.5}
.gal__n{width:24px;height:24px;border-radius:8px;background:var(--g-wash);color:var(--g-deep);
 display:grid;place-items:center;font-size:.7rem;font-weight:800;flex-shrink:0}

/* celoplošný pás s vyhlásením */
.band{position:relative;overflow:hidden;background:var(--ink);color:#fff;padding:clamp(64px,8vw,110px) 0;text-align:center}
.band__img{position:absolute;inset:0;opacity:.46}
.band__img img{width:100%;height:100%;object-fit:cover}
.band__v{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,8,6,.8),rgba(12,8,6,.62))}
.band__in{position:relative;z-index:2;max-width:44rem;margin:0 auto}
.band__h{font-size:clamp(1.4rem,2.8vw,2.2rem);font-weight:700;letter-spacing:-.036em;line-height:1.28;text-wrap:balance}
.band .btn{margin-top:30px}

/* POHYB ----------------------------------------------------------------- */
/* Odhaľovanie pri scrollovaní. Trieda .js-motion pridá skript, takže bez
   JavaScriptu ostane obsah normálne viditeľný. */
.js-motion [data-reveal]{opacity:0;transform:translateY(26px);
 transition:opacity .8s var(--ease),transform .8s var(--ease);
 transition-delay:var(--d,0ms);will-change:opacity,transform}
/* Vodorovný posun len tam, kde je vedľa seba dosť miesta — inak by
   neodhalený prvok vytlačil stránku do strany. */

.ft__l-hi{color:var(--g-hi);font-weight:600}
.ft__l-hi::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--g);margin-left:7px;vertical-align:middle}

/* Obchodný kontakt pod kalkulačkou. Dve tlačidlá vedľa seba, na úzkej
   obrazovke pod sebou na celú šírku — telefón sa má dať trafiť palcom. */
.ksales__b{width:100%;margin-top:16px}
.ksales{border-top:1px solid var(--line);margin-top:16px;padding-top:16px}
.ksales__h{font-size:.82rem;font-weight:600;color:var(--tx2);margin:0 0 12px;line-height:1.5}
.ksales__acts{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.ksales__acts .btn{width:100%;padding-left:16px;padding-right:16px;font-size:.78rem}
@media (max-width:520px){
 .ksales__acts{grid-template-columns:1fr}
}

/* ═══ Deň otvorených dverí ═══════════════════════════════════════════════
   Pristávacia stránka pre platenú reklamu. Hlavička je hutnejšia než na
   ostatných podstránkach — fakty o termíne musia byť vidieť bez rolovania,
   preto sú v páse hneď pod nadpisom a nie až v obsahu. */
.phead--dod{padding-bottom:clamp(38px,5vw,64px)}
.phead--dod h1{max-width:18ch}
.dod__tag{display:inline-flex;align-items:center;gap:8px;font-size:.62rem;font-weight:800;
 letter-spacing:.17em;text-transform:uppercase;color:var(--g-hi);
 background:rgba(255,90,31,.14);border:1px solid rgba(255,90,31,.34);
 padding:7px 14px;border-radius:999px;margin-bottom:16px}
.dod__tag svg{width:14px;height:14px;stroke:var(--g-hi);fill:none;stroke-width:2.6}
.dod__claim{color:#fff;font-size:clamp(1rem,1.5vw,1.25rem);font-weight:600;
 letter-spacing:-.02em;margin-top:12px;opacity:.92}
.phead--dod .lede{margin-top:14px}

/* Štyri fakty o termíne. Ikona vľavo, popisok nad hodnotou — pri dlhej
   adrese by sa vedľa seba nezmestili. */
.dodfacts{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;
 margin:clamp(24px,3vw,34px) 0 0;background:rgba(255,255,255,.14);
 border:1px solid rgba(255,255,255,.16);border-radius:18px;overflow:hidden}
.dodfacts li{display:flex;align-items:flex-start;gap:11px;padding:16px 18px;
 background:rgba(20,15,12,.72)}
.dodfacts svg{width:19px;height:19px;stroke:var(--g-hi);fill:none;stroke-width:2;
 flex-shrink:0;margin-top:2px}
.dodfacts li>span{display:flex;flex-direction:column;gap:3px;min-width:0;
 color:#fff;font-size:.86rem;font-weight:600;line-height:1.4}
.dodfacts b{font-size:.57rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
 color:rgba(255,255,255,.56)}

/* Odpočet. Kým skript nebeží, je v ňom dátum slovom. */
.dodcd{margin-top:clamp(20px,2.4vw,26px);display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.dodcd__h{font-size:.58rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
 color:rgba(255,255,255,.55);margin:0}
.dodcd__v{margin:0;color:#fff;font-size:clamp(1rem,1.8vw,1.35rem);font-weight:700;
 letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dodcd[data-stav="prebieha"] .dodcd__v{color:var(--g-hi)}
.dodcd[data-stav="po"] .dodcd__v{font-size:.95rem;font-weight:600;color:rgba(255,255,255,.7)}
.phead--dod .phead__acts{margin-top:clamp(24px,3vw,32px)}

/* Súťaž — jediné veľké číslo na stránke. */
.dvy{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(24px,4vw,52px);align-items:center;
 background:var(--ink);color:#fff;border-radius:26px;padding:clamp(26px,4vw,52px);
 position:relative;overflow:hidden}
.dvy::after{content:"";position:absolute;right:-12%;top:-40%;width:56%;aspect-ratio:1;
 background:radial-gradient(circle,rgba(255,90,31,.34),transparent 68%);pointer-events:none}
.dvy>*{position:relative;z-index:2;min-width:0}
.dvy .tagline{color:var(--g-hi)}
.dvy .tagline svg{stroke:var(--g-hi)}
.dvy h2{color:#fff;max-width:16ch}
.dvy__x{color:rgba(255,255,255,.76);margin-top:16px;line-height:1.8;max-width:52ch;font-size:.95rem}
.dvy__list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px}
.dvy__list li{display:flex;align-items:flex-start;gap:11px;font-size:.88rem;
 color:rgba(255,255,255,.86);line-height:1.6}
.dvy__list svg{width:17px;height:17px;stroke:var(--g-hi);fill:none;stroke-width:2.6;
 flex-shrink:0;margin-top:3px}
.dvy__rules{margin:22px 0 0}
.dvy__rules .go{color:var(--g-hi)}
.dvy__warn{margin-top:22px}
.dvy__r{display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:6px}
.dvy__label{font-size:.58rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
 color:rgba(255,255,255,.5)}
.dvy__num{font-size:clamp(2.4rem,6vw,4.4rem);font-weight:800;letter-spacing:-.05em;
 line-height:1;color:var(--g-hi);font-variant-numeric:tabular-nums;white-space:nowrap}
.dvy__note{font-size:.8rem;color:rgba(255,255,255,.62);max-width:20ch}

/* Program — šesť rovnocenných dlaždíc, bez číslovania. */
.dprg{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px)}
.dprg__i{background:#fff;border:1px solid var(--line);border-radius:20px;
 padding:clamp(20px,2.2vw,28px);transition:border-color .26s,transform .26s,box-shadow .26s}
.dprg__i:hover{border-color:var(--g);transform:translateY(-3px);
 box-shadow:0 20px 44px -26px rgba(19,17,16,.28)}
.dprg__ico{width:44px;height:44px;border-radius:13px;background:var(--g-wash);
 display:grid;place-items:center;margin-bottom:16px}
.dprg__ico svg{width:21px;height:21px;stroke:var(--g-deep);fill:none;stroke-width:2}
.dprg__i h3{font-size:1.02rem;font-weight:700;letter-spacing:-.024em;margin-bottom:9px}
.dprg__i p{font-size:.87rem;color:var(--tx2);line-height:1.78}

/* Pre koho */
.dkm{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px)}
.dkm__i{background:var(--pap2);border-radius:20px;padding:clamp(20px,2.2vw,26px)}
.dkm__ico{width:40px;height:40px;border-radius:12px;background:#fff;border:1px solid var(--line);
 display:grid;place-items:center;margin-bottom:15px}
.dkm__ico svg{width:19px;height:19px;stroke:var(--g-deep);fill:none;stroke-width:2}
.dkm__i h3{font-size:.98rem;font-weight:700;letter-spacing:-.022em;margin-bottom:8px}
.dkm__i p{font-size:.85rem;color:var(--tx2);line-height:1.76}

/* Partneri */
.dpa__h{font-size:.6rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;
 color:var(--tx3);margin:0 0 16px}
.dpa__h--sub{margin-top:clamp(30px,3.6vw,44px)}
.pcards{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.6vw,20px)}
.pcard{display:flex;align-items:center;gap:clamp(16px,2vw,26px);background:#fff;
 border:1px solid var(--line);border-radius:20px;padding:clamp(20px,2.2vw,28px);
 transition:border-color .26s,transform .26s,box-shadow .26s}
a.pcard:hover{border-color:var(--g);transform:translateY(-3px);
 box-shadow:0 20px 44px -26px rgba(19,17,16,.28)}
.pcard__logo{flex-shrink:0;width:clamp(120px,15vw,180px);display:grid;place-items:center}
.pcard__logo img{max-height:56px;width:auto;object-fit:contain}
.pcard__meta{display:flex;flex-direction:column;gap:3px;min-width:0}
.pcard__meta b{font-size:1rem;font-weight:700;letter-spacing:-.022em}
.pcard__meta em{font-style:normal;font-size:.84rem;color:var(--tx2)}
/* Trojica kariet partnerov na podstránke O nás. Logo je nad textom, nie
   vedľa neho — pri troch kartách v rade nie je na dvojstĺpec miesto. */
.pcards--3{grid-template-columns:repeat(3,1fr)}
.pcard--col{flex-direction:column;align-items:flex-start;gap:18px;text-align:left}
.pcard--col .pcard__logo{width:100%;height:64px;place-items:center start}
.pcard--col .pcard__logo img{max-height:52px}
@media (max-width:900px){
 .pcards--3{grid-template-columns:1fr}
 .pcard--col{flex-direction:row;align-items:center;gap:clamp(16px,2vw,26px)}
 .pcard--col .pcard__logo{width:clamp(120px,26vw,170px);height:auto;place-items:center}
}
.pcard .ar{margin-left:auto;color:var(--g-deep);flex-shrink:0}

/* Dlaždice ostatných partnerov. Zástupná verzia má rovnaké rozmery ako tá
   s logom, takže doplnenie loga stránku neposunie. */
.dpa__grid{list-style:none;margin:0;padding:0;display:grid;
 grid-template-columns:repeat(6,1fr);gap:10px}
.dpa__tile{background:#fff;border:1px solid var(--line);border-radius:14px;
 height:84px;display:grid;place-items:center;padding:12px}
.dpa__tile img{max-height:44px;width:auto;object-fit:contain}
.dpa__tile--text{background:var(--pap2);border-style:dashed;border-color:var(--line2)}
.dpa__tile--text span{font-size:.78rem;font-weight:700;color:var(--tx3);text-align:center;
 letter-spacing:-.01em;line-height:1.3}

/* Miesto */
.dmi__list{list-style:none;margin:0 0 clamp(20px,2.4vw,26px);padding:0;
 display:flex;flex-wrap:wrap;gap:10px 26px}
.dmi__list li{display:flex;align-items:center;gap:9px;font-size:.87rem;color:var(--tx2)}
.dmi__list svg{width:16px;height:16px;stroke:var(--g-deep);fill:none;stroke-width:2.6;flex-shrink:0}

/* Záverečná výzva */
.dct{display:flex;align-items:center;justify-content:space-between;gap:clamp(20px,3vw,40px);
 flex-wrap:wrap;background:var(--pap2);border:1px solid var(--line);border-radius:24px;
 padding:clamp(24px,3.4vw,40px)}
.dct p{color:var(--tx2);margin-top:10px;max-width:52ch;font-size:.92rem;line-height:1.78}
.dct__acts{display:flex;gap:11px;flex-wrap:wrap}

/* Odkaz na plagát v hlavičke — zámerne tichší než tlačidlá. */
.dod__pdf{margin:16px 0 0}
.dod__pdf a{display:inline-flex;align-items:center;gap:9px;font-size:.83rem;font-weight:600;
 color:rgba(255,255,255,.72);border-bottom:1px solid rgba(255,255,255,.24);
 padding-bottom:2px;transition:color .22s,border-color .22s}
.dod__pdf a:hover{color:#fff;border-color:var(--g-hi)}
.dod__pdf svg{width:16px;height:16px;stroke:var(--g-hi);fill:none;stroke-width:2;flex-shrink:0}

.dvy__act{margin:24px 0 0}

/* Prihlásenie do súťaže — vysvetlenie vľavo, formulár vpravo. */
.dfm{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,64px);align-items:start}
.dfm__steps{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px;counter-reset:none}
.dfm__steps li{display:flex;align-items:flex-start;gap:14px;font-size:.9rem;
 color:var(--tx2);line-height:1.7}
.dfm__n{width:26px;height:26px;border-radius:50%;background:var(--g-wash);color:var(--g-deep);
 font-size:.75rem;font-weight:800;display:grid;place-items:center;flex-shrink:0;margin-top:2px}
.dfm__note{margin-top:22px;font-size:.83rem;color:var(--tx3);line-height:1.75;max-width:52ch}

/* Nepovinný súhlas — vizuálne odlíšený od povinného, aby bolo jasné,
   že sa bez neho formulár odošle. */
.consent--opt{border-top:1px solid var(--line);padding-top:16px;margin-top:4px}

/* Výber kalendára. Ponuka je nad ostatným obsahom, preto vyšší z-index
   než má prekryv hlavičky. */
.dodcal{position:relative}
.dodcal__ch{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
 border-top:5px solid currentColor;margin-left:2px;flex-shrink:0}
.dodcal__m{position:absolute;top:calc(100% + 8px);left:0;z-index:30;min-width:min(260px,80vw);
 list-style:none;margin:0;padding:6px;background:#fff;border:1px solid var(--line);
 border-radius:16px;box-shadow:0 24px 60px -24px rgba(0,0,0,.45)}
.dodcal__m a{display:block;padding:11px 14px;border-radius:11px;font-size:.86rem;font-weight:600;
 color:var(--tx);transition:background .18s,color .18s}
.dodcal__m a:hover,.dodcal__m a:focus-visible{background:var(--g-wash);color:var(--g-deep)}

/* Poznámka o podmienke súťaže pri súhlase. Je nad zaškrtávacím políčkom,
   nie pod ním — kto ju prehliadne, nemôže povedať, že tam nebola. */
.consent__note{grid-column:1/-1;margin:0 0 12px;padding:12px 15px;background:var(--g-wash);
 border:1px solid var(--g-wash2);border-radius:12px;font-size:.8rem;line-height:1.65;color:var(--tx2)}
.consent__note strong{color:var(--tx);font-weight:600}

@media (max-width:900px){
 .dfm{grid-template-columns:1fr}
}

@media (max-width:1100px){
 .dodfacts{grid-template-columns:repeat(2,1fr)}
 .dprg{grid-template-columns:repeat(2,1fr)}
 .dkm{grid-template-columns:repeat(2,1fr)}
 .dpa__grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:820px){
 .dvy{grid-template-columns:1fr}
 .dvy__r{align-items:flex-start;text-align:left}
 .dvy__note{max-width:none}
 .pcards{grid-template-columns:1fr}
}
@media (max-width:640px){
 .dodfacts{grid-template-columns:1fr}
 .dprg{grid-template-columns:1fr}
 .dkm{grid-template-columns:1fr}
 .dpa__grid{grid-template-columns:repeat(3,1fr)}
 .pcard{flex-wrap:wrap;gap:16px}
 .pcard__logo{width:140px}
 .dct__acts{width:100%}
 .dct__acts .btn{width:100%;justify-content:center}
}

/* ═══ Sprievodca cenovou ponukou ═════════════════════════════════════════
   Značka <dialog> — prekrytie, zachytenie klávesnice aj Escape rieši
   prehliadač. Nám zostáva vzhľad. */
/* Atribút hidden musí prebiť vlastný display. Sady otázok aj tlačidlá
   sa prepínajú cez hidden a bez tohto by boli vidieť všetky naraz —
   pravidlo display:grid z autorského štýlu je silnejšie než UA. */
.pon [hidden]{display:none!important}
.pon{margin:auto;width:min(780px,calc(100vw - 24px));max-height:min(94vh,940px);padding:0;border:0;
 border-radius:26px;background:var(--pap);color:var(--tx);overflow:hidden;
 box-shadow:0 24px 60px -24px rgba(0,0,0,.42)}
.pon::backdrop{background:rgba(12,8,6,.68)}
.pon__form{display:flex;flex-direction:column;max-height:inherit}

.pon__hd{position:relative;padding:clamp(16px,2.2vw,22px) clamp(20px,2.6vw,30px) 0;
 background:var(--g-wash);border-bottom:1px solid var(--g-wash2)}
.pon__tag{font-size:.6rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
 color:var(--g-deep);margin:0 0 6px}
.pon__h{font-size:clamp(1.25rem,2.4vw,1.75rem);font-weight:800;letter-spacing:-.035em;
 margin:0;padding-right:44px;text-wrap:balance}
.pon__x{font-size:.83rem;color:var(--tx2);line-height:1.6;margin:7px 0 0;max-width:62ch}
/* Úvodný odstavec je pomôcka pri prvom kroku. Ďalej už len zaberá výšku,
   ktorú potrebujú polia — a kvôli nemu by sa muselo rolovať. */
.pon[data-krok="2"] .pon__x,.pon[data-krok="3"] .pon__x,.pon[data-krok="hotovo"] .pon__x{display:none}
.pon__x-btn{position:absolute;top:clamp(18px,2.4vw,24px);right:clamp(18px,2.4vw,24px);
 width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:#fff;
 display:grid;place-items:center;cursor:pointer;transition:.2s}
.pon__x-btn:hover{border-color:var(--g);background:var(--g-wash)}
.pon__x-btn svg{width:17px;height:17px;stroke:var(--tx);fill:none;stroke-width:2}
.pon__krok{font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
 color:var(--tx3);margin:12px 0 6px}
.pon__bar{height:5px;border-radius:99px;background:var(--g-wash2);overflow:hidden;
 margin-bottom:0}
.pon__hd{padding-bottom:0}
.pon__bar span{display:block;height:100%;width:33.33%;border-radius:99px;background:var(--g);
 transition:width .34s var(--ease)}

.pon__body{padding:clamp(18px,2.4vw,24px) clamp(20px,2.6vw,30px);overflow-y:auto;flex:1 1 auto}
.pon__otazka{font-size:1rem;font-weight:700;letter-spacing:-.024em;margin:0 0 12px}

/* Krok 1 — dlaždice služieb */
.pon__tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pon__tile{position:relative;display:flex;align-items:center;gap:13px;padding:13px 15px;
 border:1.5px solid var(--line);border-radius:16px;cursor:pointer;background:#fff;
 transition:border-color .2s,background .2s,transform .2s}
.pon__tile:hover{border-color:var(--g-wash2);transform:translateY(-2px)}
.pon__tile input{position:absolute;opacity:0;width:0;height:0}
.pon__tile:has(input:checked){border-color:var(--g);background:var(--g-wash)}
.pon__tile:has(input:focus-visible){outline:2px solid var(--g);outline-offset:2px}
.pon__tile-ico{width:42px;height:42px;border-radius:12px;background:var(--g-wash);
 display:grid;place-items:center;flex-shrink:0;transition:background .2s}
.pon__tile:has(input:checked) .pon__tile-ico{background:var(--g);}
.pon__tile-ico svg{width:20px;height:20px;stroke:var(--g-deep);fill:none;stroke-width:2}
.pon__tile:has(input:checked) .pon__tile-ico svg{stroke:var(--ink)}
.pon__tile-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.pon__tile-t b{font-size:.88rem;font-weight:700;letter-spacing:-.018em;line-height:1.3}
.pon__tile-t em{font-style:normal;font-size:.76rem;color:var(--tx2);line-height:1.45}

/* Kroky 2 a 3 — polia. Preberáme vzhľad z .fld, len na svetlom podklade. */
.pon__sada,.pon__grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.pon .fld label{color:var(--tx3)}
.pon .fld input,.pon .fld select,.pon .fld textarea{color:var(--tx);background:var(--pap2);
 border-color:var(--line)}
.pon .fld input:focus,.pon .fld select:focus,.pon .fld textarea:focus{background:#fff;
 border-color:var(--g)}
.pon .fld input[type="file"]{padding:12px 14px;font-size:.82rem;cursor:pointer}
.fld__hint{display:block;font-size:.74rem;color:var(--tx3);line-height:1.55;margin-top:6px}
/* Súhlas je posledná vec pred odoslaním — nech nelipne na bloku nad ním
   a nech sa dá do zaškrtávacieho políčka pohodlne trafiť. */
.pon .consent{margin-top:14px;padding:14px 16px;background:var(--pap2);
 border:1px solid var(--line);border-radius:13px;align-items:center;gap:13px}
.pon .consent[data-invalid="true"]{border-color:var(--err-line);background:var(--err-bg)}
.pon .consent input{margin-top:0;width:21px;height:21px}
.pon .consent label{color:var(--tx2)}

.pon__fs{border:0;padding:0;margin:13px 0 0}
.pon__fs legend{font-size:.62rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
 color:var(--tx3);padding:0;margin-bottom:11px}
.pon__fs--soft{background:var(--pap2);border-radius:16px;padding:12px 15px;margin-top:13px}
.pon__fs--soft legend{margin-bottom:13px}
.pon__radio{display:flex;flex-wrap:wrap;gap:9px}
.pon__radio label{display:inline-flex;align-items:center;gap:9px;padding:11px 16px;
 border:1.5px solid var(--line);border-radius:99px;cursor:pointer;font-size:.83rem;
 font-weight:600;background:#fff;transition:.2s}
.pon__radio label:has(input:checked){border-color:var(--g);background:var(--g-wash);color:var(--g-deep)}
.pon__radio input{accent-color:var(--g);width:16px;height:16px}
/* Nepovinné polia zabalené do jedného riadka. Zatvorené zaberajú 46 px
   namiesto 330 — vďaka tomu sa tretí krok zmestí na obrazovku. */
.pon__viac{margin-top:13px;border:1px solid var(--line);border-radius:14px;background:var(--pap2);overflow:hidden}
.pon__viac summary{list-style:none;cursor:pointer;display:flex;align-items:center;
 justify-content:space-between;gap:14px;padding:13px 16px;font-size:.83rem;font-weight:600;
 color:var(--tx2);transition:color .2s,background .2s}
.pon__viac summary::-webkit-details-marker{display:none}
.pon__viac summary:hover{color:var(--g-deep);background:var(--g-wash)}
.pon__viac summary:focus-visible{outline:2px solid var(--g);outline-offset:-2px}
.pon__viac-ch{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
 transform:rotate(45deg) translate(-2px,-2px);flex-shrink:0;transition:transform .24s var(--ease)}
.pon__viac[open] .pon__viac-ch{transform:rotate(225deg) translate(-2px,-2px)}
.pon__viac[open] summary{border-bottom:1px solid var(--line);background:#fff}
.pon__viac-in{padding:4px 16px 16px}
.pon__viac .pon__fs{margin-top:12px}

.pon__hint{font-size:.74rem;color:var(--tx3);line-height:1.55;margin:9px 0 0}
/* Prílohy a poznámka vedľa seba. Textarea je nižšia než pole so súborom
   plus jeho vysvetlivka, preto sa zarovnávajú na vrch, nie na výšku. */
.pon__grid--nepovinne{align-items:start;margin-top:13px}
.pon__grid--nepovinne textarea{min-height:74px;resize:vertical}
.pon__grid--nepovinne .fld__hint{margin-top:5px}

/* Odhad v druhom kroku */
.pon__odhad{margin-top:22px;background:var(--ink);color:#fff;border-radius:20px;
 padding:20px 22px}
.pon__odhad-h{font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
 color:var(--g-hi);margin:0 0 14px}
.pon__odhad-g{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pon__odhad-g span{display:flex;flex-direction:column;gap:3px;min-width:0}
.pon__odhad-g b{font-size:clamp(1rem,1.9vw,1.3rem);font-weight:800;letter-spacing:-.03em;
 font-variant-numeric:tabular-nums;white-space:nowrap}
.pon__odhad-g em{font-style:normal;font-size:.68rem;color:rgba(255,255,255,.6);line-height:1.35}
.pon__odhad-x{font-size:.74rem;color:rgba(255,255,255,.6);line-height:1.65;margin:14px 0 0}

/* Hotovo */
.pon__hotovo{text-align:center;padding:clamp(20px,4vw,44px) 0}
.pon__ok{width:62px;height:62px;border-radius:50%;background:var(--ok-bg);border:1px solid var(--ok-line);
 display:grid;place-items:center;margin:0 auto 18px}
.pon__ok svg{width:28px;height:28px;stroke:var(--ok);fill:none;stroke-width:2.6}
.pon__hotovo-h{font-size:1.3rem;font-weight:800;letter-spacing:-.03em;margin:0 0 10px}
.pon__hotovo-x{font-size:.9rem;color:var(--tx2);line-height:1.75;max-width:48ch;margin:0 auto}

/* Pätička okna */
.pon__ft{display:flex;align-items:center;gap:12px;padding:13px clamp(20px,2.6vw,30px);
 border-top:1px solid var(--line);background:var(--pap2)}
.pon__ft .fmsg{flex:1 1 auto;margin:0;font-size:.8rem;text-align:center}
.pon__ft .btn{flex-shrink:0}
.pon__ft [data-ponuka-spat]{margin-right:auto}
.pon__ft [data-ponuka-dalej],.pon__ft [data-ponuka-odoslat]{margin-left:auto}

/* Nízke obrazovky — na notebooku 768 px má okno na obsah asi o tretinu
   menej výšky než na 1080p. Hlavička sa preto stiahne na nevyhnutné:
   nadpisík a úvodný text idú preč, zostane nadpis, krok a pás postupu. */
@media (max-height:820px){
 .pon{max-height:97vh}
 .pon__tag{display:none}
 .pon__h{font-size:1.15rem}
 .pon__x{display:none}
 .pon__hd{padding-top:14px}
 .pon__krok{margin:9px 0 5px}
 .pon__body{padding-top:14px;padding-bottom:14px}
 .pon__otazka{margin-bottom:10px}
 .pon__fs{margin-top:10px}
 .pon__fs--soft{margin-top:10px;padding:10px 13px}
 .pon__grid--nepovinne{margin-top:10px}
 .pon__radio label{padding:8px 13px}
 .pon__ft{padding-top:8px;padding-bottom:8px}
 .pon__grid--nepovinne textarea{min-height:62px}
 .pon .consent{margin-top:10px;padding:10px 13px}
}

@media (max-width:640px){
 .pon{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
 .pon__tiles,.pon__sada,.pon__grid{grid-template-columns:1fr}
 .pon__odhad-g{grid-template-columns:1fr 1fr}
 .pon__ft{flex-wrap:wrap}
 .pon__ft .btn{flex:1 1 auto;justify-content:center}
 .pon__ft .fmsg{order:-1;flex:1 1 100%}
}

@media (min-width:1101px){
 .js-motion [data-reveal="left"]{transform:translateX(-28px)}
 .js-motion [data-reveal="right"]{transform:translateX(28px)}
}
.js-motion [data-reveal="zoom"]{transform:scale(.965)}
.js-motion [data-reveal].is-in{opacity:1;transform:none}

/* pomalé priblíženie fotky v hero */
.hero__img img{animation:kb 26s ease-out both}
@keyframes kb{from{transform:scale(1.09)}to{transform:scale(1)}}

/* jemný parallax — posun rieši skript cez --shift */
.hero__img{will-change:transform;transform:translate3d(0,var(--shift,0px),0)}

/* zvýraznenie čísla pri nábehu */
.strip__i b{transition:color .4s var(--ease)}

/* plávajúce telefónne tlačidlo na mobile */
.fab{display:none;position:fixed;right:16px;bottom:16px;z-index:280;width:56px;height:56px;border-radius:50%;background:var(--g);color:var(--ink);place-items:center;box-shadow:0 12px 30px -8px rgba(19,17,16,.5)}
.fab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}

/* RESPONZIVITA ---------------------------------------------------------- */
@media (max-width:1100px){
 .nav__m{display:none}
 .burger{display:flex}
 .nav__tel{display:none}
 .hd{grid-template-columns:1fr;gap:20px}
 .pk{grid-template-columns:1fr}
 .pkc{min-height:280px}
 .dot,.kal,.faq,.cols,.cols--wide,.rz{grid-template-columns:1fr}
 .steps{grid-template-columns:1fr 1fr}
 .rzbig{min-height:320px}
 .cta__in{grid-template-columns:1fr;gap:36px}
 .ft__top{grid-template-columns:1fr 1fr}
 .nl__in{grid-template-columns:1fr;gap:26px}
 .strip__i{flex:1 1 45%;border-bottom:1px solid rgba(255,255,255,.08)}
 .strip__i:nth-child(2n){border-right:0}
 .aside{position:static}
 .flow,.prio{grid-template-columns:1fr 1fr}
 .cmsplit,.evgrid{grid-template-columns:1fr}
 .elgrid{grid-template-columns:repeat(2,1fr)}
 .kal--top>:first-child{position:static}
 .stx{grid-template-columns:1fr;gap:clamp(18px,2.4vw,26px)}
 .stx__h{position:static}
 .reg__in{grid-template-columns:1fr}
 .phead__in--split{grid-template-columns:1fr;gap:clamp(26px,3.6vw,42px)}
 .dfan{min-height:440px}
 .bgrid{grid-template-columns:repeat(2,1fr)}
 .bp--velka{flex-direction:column}
 .bp--velka .bp__ph{flex:none;width:100%;aspect-ratio:16/9}
 .cfgrid{grid-template-columns:repeat(2,1fr)}
 .tlwrap{grid-template-columns:1fr}
 .tlwrap__ph{position:static;aspect-ratio:16/9;max-height:420px}
 .cmsplit__ph,.evgrid__ph{position:static}
 .evgrid__ph{aspect-ratio:16/9;max-height:420px}
 .steps--3{grid-template-columns:1fr 1fr}
 .cmsplit__ph{position:static;aspect-ratio:16/9;max-height:420px}
 .gal{grid-template-columns:1fr 1fr}
 .price{grid-template-columns:1fr 1fr}
 .pc--hi{transform:none}
}
@media (max-width:900px){
 .svc{grid-template-columns:1fr}
 .elgrid{grid-template-columns:1fr}
 /* vejár je ozdoba — na úzkom displeji by len tlačil obsah nadol */
 .dfan{display:none}
 /* dom a jeho popis pod sebou — vedľa seba by bol dom pritesný */
 .hsim__stage{grid-template-columns:1fr}
 .hsim__panel{align-items:flex-start}
 .flow{grid-template-columns:1fr}
 /* spojnica sa otočí pod kartu */
 .flow__i::after{left:50%;top:100%;width:2px;height:clamp(18px,2.4vw,34px);
  background-image:linear-gradient(180deg,var(--g) 55%,transparent 55%);background-size:2px 9px;background-repeat:repeat-y;
  animation-name:marchdown}
 @keyframes marchdown{to{background-position:0 9px}}
}
@media (max-width:640px){
 /* tlačidlo na celú šírku kalkulačky nesmie ťahať mriežku do strany */
 .kbox .btn{white-space:normal}
 .bgrid{grid-template-columns:1fr}
 .bcta__acts{width:100%}
 .bcta__acts .btn{width:100%;justify-content:center}
 .cfgrid{grid-template-columns:1fr}
 .cfil__b{padding:9px 14px;font-size:.74rem}
 .cf__m>div{flex-direction:column;align-items:flex-start;gap:2px}
 .cf__m dd{text-align:left}
 .rent{grid-template-columns:1fr}
 .rent__grid{grid-template-columns:1fr}
 .rent__card{flex-direction:column;align-items:flex-start}
 .rent__act{width:100%}
 .rent__act .btn{width:100%;justify-content:center}
 .hero{min-height:auto}
 .hero__in{padding-top:clamp(150px,22vh,190px)}
 .hero__acts{flex-direction:column}
 .hero__acts .btn{width:100%}
 /* tlačidlá scenárov po dvoch v riadku */
 .hsim__btn{flex:1 1 calc(50% - 4px)}
 /* na úzkom displeji sa rok nezmestí vedľa textu — dáme ho nad neho */
 .tline{padding-left:26px}
 .tline::before{left:5px}
 .tl::before{left:-26px}
 .tl__y{position:static;display:block;width:auto;text-align:left;margin-bottom:6px}
 .hs__name{font-size:19px}
 .hs__temp{font-size:21px}
 .hs__alarm-t{font-size:19px}
 .hs__alarm-bg{width:150px}
 .hs__alarm-d{r:6px}
 .strip__i{flex:1 1 100%;border-right:0}
 .dot__cards{grid-template-columns:1fr}
 .steps{grid-template-columns:1fr}
 .kout{grid-template-columns:1fr}
 .form{grid-template-columns:1fr}
 .billrow{grid-template-columns:repeat(3,1fr)}
 .prio,.comp,.price{grid-template-columns:1fr}
 .gal{grid-template-columns:1fr}
 .steps--3{grid-template-columns:1fr}
 .strip-ph img{aspect-ratio:4/3}
 .evgrid__ph{aspect-ratio:4/3}
 .carousel__i{flex-basis:min(78vw,300px)}
 .cmsplit__ph{aspect-ratio:4/3}
 .cmp{grid-template-columns:1fr 1fr;padding:22px}
 .phead__acts .btn{width:100%}
 .rzbig{min-height:260px}
 .ctastep__w{display:none}
 .ft__top{grid-template-columns:1fr}
 .ktiles{grid-template-columns:1fr}
 .billrow{grid-template-columns:1fr}
 .kmap__head .btn{width:100%}
 .nlform__row{flex-direction:column}
 .nlform .btn{width:100%}
 .ft__bt{flex-direction:column;text-align:center;gap:9px}
 .ft__l{gap:0}
 .fab{display:grid}
}
@media (hover:none){
 .ft__l a,.ft__c a,.ft__bt a,.cta__tel a{padding:12px 0}
 .go{min-height:44px}
 .ft__l{gap:0}
 .ft__c{margin-bottom:2px}
}
@media (prefers-reduced-motion:reduce){
 *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
 html{scroll-behavior:auto}
 .js-motion [data-reveal]{opacity:1!important;transform:none!important}
 .marquee__track{animation:none;transform:none}
 .flow__i::after{animation:none}
 .js-motion .cmp__fill{height:var(--v,40%)}
 .js-motion .ladder__fill{width:var(--v,50%)}
 .carousel__track{scroll-behavior:auto}
 .marquee{-webkit-mask-image:none;mask-image:none}
 .marquee__group:nth-child(2){display:none}
 .marquee__track{flex-wrap:wrap;justify-content:center;width:100%}
 .hero__img{transform:none}
}
@media print{
 .nav,.drawer,.fab,.cta,.hero__acts{display:none}
 body{color:#000}
}
