@font-face{font-family:'Unbounded';src:url(fonts/unbounded.woff2) format('woff2');font-weight:500 900;font-display:swap}
@font-face{font-family:'Hanken Grotesk';src:url(fonts/hanken.woff2) format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:'Martian Mono';src:url(fonts/martian.woff2) format('woff2');font-weight:400 600;font-display:swap}

:root{
  --ink:#0E1A2B; --ink-2:#44506A; --ink-3:#1B2A42;
  --paper:#F3F1EC; --paper-2:#FBFAF7; --line:#D6D2C8;
  --cob:#1F4FD1; --cob-d:#173DA6; --cob-l:#7F9DFF; --cob-t:#E3E9FB;
  --amber:#F2B233;
  --cut:var(--paper);
  --display:'Unbounded',system-ui,sans-serif;
  --body:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'Martian Mono',ui-monospace,monospace;
  --prst:44px; --nav-h:72px;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{font-size:clamp(15px,.45vw + 13px,19px);scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);line-height:1.04;margin:0;font-weight:800;letter-spacing:-.01em}
h2{font-size:clamp(1.7rem,3.4vw,2.9rem)}
h3{font-size:1.05rem;font-weight:700}
p{margin:0}
.wrap{width:min(100% - 2.5rem,72rem);margin-inline:auto}
@media (max-width:600px){.wrap{width:calc(100% - 2.25rem)}}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.6rem 1rem;z-index:99}
.skip:focus{left:1rem}
:focus-visible{outline:3px solid var(--cob);outline-offset:3px}

.eyebrow{font-family:var(--mono);font-size:.74rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--cob-d);margin-bottom:1rem}
.doplnit{display:inline-block;font-family:var(--mono);font-size:.72rem;line-height:1.4;color:#7A2E00;background:#FFE3B8;border:1px dashed #B85C00;padding:.3rem .55rem;border-radius:3px;margin-top:.8rem;letter-spacing:0;text-transform:none;font-weight:500}
.sec .doplnit,.h-hod .doplnit,.foto .doplnit{color:#7A2E00;background:#FFE3B8}

/* tlačidlá */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--prst);padding:.55rem 1.1rem;border-radius:999px;font-weight:700;text-decoration:none;font-size:.95rem;border:2px solid transparent;transition:background .2s,color .2s,transform .2s;white-space:nowrap}
.btn--cob{background:var(--cob);color:#fff}
.btn--cob:hover{background:var(--cob-d)}
.btn--line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn--line:hover{background:var(--ink);color:var(--paper)}
.btn--big{min-height:54px;padding:.8rem 1.5rem;font-size:1.02rem}
.btn:active{transform:translateY(1px)}

/* navigácia */
.nav{position:sticky;top:0;z-index:50;background:rgba(243,241,236,.94);border-bottom:1px solid var(--line)}
.nav::before{content:"";position:absolute;inset:0;z-index:-1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.nav__in{display:flex;align-items:center;gap:1.5rem;min-height:var(--nav-h)}
.nav__logo{display:flex;align-items:center;min-height:var(--prst);margin-right:auto}
.nav__logo img{height:30px;width:auto}
.nav__links{display:flex;gap:.25rem}
.nav__links a{display:inline-flex;align-items:center;min-height:var(--prst);padding:0 .7rem;text-decoration:none;font-weight:600;font-size:.92rem;border-radius:6px}
.nav__links a:hover{background:var(--cob-t)}
.nav__burger{display:none;width:var(--prst);height:var(--prst);border:0;background:var(--ink);border-radius:10px;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px}
.nav__burger span{display:block;width:20px;height:2px;background:var(--paper);transition:transform .25s}
.nav__burger[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
.nav__burger[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.drawer{position:fixed;inset:var(--nav-h) 0 auto 0;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1.25rem 1rem 1.75rem;z-index:49}
.drawer a{display:flex;align-items:center;justify-content:center;min-height:var(--prst);width:100%;max-width:22rem;text-decoration:none;font-weight:600;font-size:1.1rem}
.drawer a.btn--cob{color:#fff;margin-top:.75rem}
@media (max-width:900px){.nav__links{display:none}.nav__burger{display:flex}.nav__tel{display:none}}
@media (min-width:901px){.drawer{display:none !important}}

/* hero */
.hero{min-height:calc(100svh - var(--nav-h));display:flex;flex-direction:column;justify-content:center;padding-block:clamp(1.5rem,4vh,3rem) clamp(1.25rem,3vh,2.25rem);overflow:hidden}
.hero__in{display:grid;grid-template-columns:1.35fr .9fr;gap:2rem;align-items:center}
.hero__in>*{min-width:0}
.hero h1{font-size:clamp(2.2rem,min(6.2vw,9.4vh),5.4rem);font-weight:900;text-transform:uppercase;letter-spacing:-.02em}
.hero h1 span{display:block;color:var(--cob);font-size:.46em;font-weight:700;letter-spacing:0;margin-top:.55em;text-transform:none}
.hero__lead{max-width:34rem;margin-top:clamp(1rem,2.4vh,1.6rem);font-size:1.08rem;color:var(--ink-2)}
.hero__cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:clamp(1.2rem,3vh,2rem)}
.hero__mark{color:var(--cob);--cut:var(--paper)}
.pegas{width:100%;max-width:26rem;margin-left:auto;display:block;overflow:visible}
.strip{display:grid;grid-template-columns:repeat(4,1fr);margin:clamp(1.5rem,4vh,3rem) 0 0;border-top:2px solid var(--ink)}
.strip>div{padding:.9rem 1rem .2rem 0;min-width:0}
.strip dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.strip dd{margin:.25rem 0 0;font-weight:600;font-size:.98rem}
.strip b{font-family:var(--display);font-weight:800}
.live::before{content:"";display:inline-block;width:.6em;height:.6em;border-radius:50%;background:var(--ink-2);margin-right:.45em;vertical-align:.05em}
.live.is-open::before{background:#1E9E57;box-shadow:0 0 0 3px rgba(30,158,87,.18)}
.live.is-closed::before{background:#B4411E}
@media (max-width:900px){
  .hero__in{grid-template-columns:1fr}
  .hero__mark{position:absolute;right:-3rem;top:calc(var(--nav-h) + 1rem);width:9rem;opacity:.12;pointer-events:none}
  .hero{position:relative}
  .strip{grid-template-columns:repeat(2,1fr)}
}

/* sekcie */
.sec{padding-block:clamp(3.5rem,9vw,7rem)}
.sec__head{max-width:44rem;margin-bottom:2.5rem}
.sec__head--row{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;max-width:none;flex-wrap:wrap}
.n{font-family:var(--mono);font-size:.72rem;color:var(--cob-d);letter-spacing:.06em}

/* služby: redakčný zoznam v dvoch stĺpcoch */
.sluzby{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;border-top:2px solid var(--ink)}
.sluzby li{display:grid;grid-template-columns:3rem 1fr;column-gap:1rem;row-gap:.3rem;padding:1.15rem 0;border-bottom:1px solid var(--line);transition:background .25s,padding .25s}
.sluzby .n{grid-row:span 2;padding-top:.2rem}
.sluzby p{color:var(--ink-2)}
.sluzby li:hover{background:var(--cob-t);padding-inline:.75rem}
@media (min-width:760px){.sluzby{grid-template-columns:1fr 1fr;column-gap:3rem}}

/* štyri takty */
.sec--takt{background:var(--paper-2);color:var(--ink);border-block:1px solid var(--line)}
.takt{display:grid;grid-template-columns:minmax(12rem,.8fr) 1.4fr;gap:clamp(2rem,6vw,5rem)}
.takt>*{min-width:0}
.takt__stage{position:sticky;top:calc(var(--nav-h) + 3rem);align-self:start;color:var(--cob);--cut:var(--paper-2)}
.valec{width:100%;max-width:15rem;display:block;margin-inline:auto;overflow:visible}
.valec__stena{fill:none;stroke:var(--ink);stroke-width:2.5}
.valec__piest{transform:translateY(calc(var(--zdvih,0) * 48px));transition:transform .35s cubic-bezier(.5,0,.3,1)}
.takt__label{text-align:center;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;margin-top:1rem;color:var(--ink)}
.takt__steps ol{list-style:none;margin:0;padding:0;counter-reset:t}
.takt__steps li{padding:1.6rem 0 1.6rem 1.25rem;border-left:3px solid var(--line);transition:border-color .3s}
.takt__steps li+li{margin-top:.5rem}
.takt__steps li.is-on{border-color:var(--cob)}
.takt__steps h3{font-size:clamp(1.3rem,2.3vw,1.8rem);margin:.35rem 0 .5rem}
.takt__steps p{color:var(--ink-2);max-width:32rem}
.takt__steps p a{display:inline-flex;align-items:center;min-height:var(--prst);font-weight:700;color:var(--cob-d)}
@media (min-width:901px){.takt__steps li{min-height:38vh}}
@media (max-width:900px){.takt{grid-template-columns:1fr}.takt__stage{display:none}}

/* záruka */
.sec--dark{background:var(--ink);color:var(--paper)}
.sec--dark .eyebrow{color:var(--cob-l)}
.zaruka h2{font-size:clamp(1.9rem,4.6vw,4rem);max-width:22ch}
.zaruka__txt{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2.5rem;max-width:56rem;color:#C9CFDB}
@media (max-width:700px){.zaruka__txt{grid-template-columns:1fr}}

/* recenzie */
.big{font-size:1.6em;color:var(--cob)}
.pas{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(1.25rem,calc((100vw - 72rem)/2)) 1.25rem;scroll-padding-inline:max(1.25rem,calc((100vw - 72rem)/2));scrollbar-width:thin}
.karta{flex:0 0 min(84vw,23rem);scroll-snap-align:start;margin:0;background:#fff;color:var(--ink);border:1px solid var(--line);border-top:4px solid var(--cob);border-radius:6px;padding:1.4rem 1.4rem 1.2rem;display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem}
.karta blockquote{margin:0;font-size:1.02rem;line-height:1.5}
.karta figcaption{font-family:var(--mono);font-size:.74rem;color:var(--ink-2)}
@media (max-width:600px){.pas{padding-inline:1.125rem;scroll-padding-inline:1.125rem}}

/* fotky: miesto pre ich vlastné */
.sec--foto{padding-block:0 clamp(3rem,7vw,5rem)}
.foto{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.foto li{aspect-ratio:4/3;border:2px dashed var(--line);border-radius:6px;display:flex;align-items:center;justify-content:center;padding:1rem;text-align:center;background:repeating-linear-gradient(135deg,transparent 0 14px,rgba(14,26,43,.035) 14px 28px)}
@media (max-width:700px){.foto{grid-template-columns:1fr}.foto li{aspect-ratio:16/7}}

/* kontakt */
.sec--kontakt{background:var(--paper-2);color:var(--ink);border-top:1px solid var(--line)}
.kontakt{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,4rem)}
.kontakt>*{min-width:0}
.adr{font-size:1.15rem;margin-top:1.25rem}
.kontakt__cta{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-top:1.5rem}
.mail{display:inline-flex;align-items:center;min-height:var(--prst);font-weight:600;color:var(--cob-d)}
.h-hod{margin-top:2.5rem;font-size:1rem;display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.h-hod .doplnit{margin-top:0}
.hodiny{border-collapse:collapse;width:100%;max-width:26rem;margin-top:.9rem;font-size:.98rem}
.hodiny th,.hodiny td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--line);font-weight:500}
.hodiny td{text-align:right;font-family:var(--mono);font-size:.85rem}
.hodiny tr.dnes{background:var(--ink);color:var(--paper)}
.hodiny tr.dnes th{font-weight:700}
.mapa{min-height:22rem;border-radius:6px;overflow:hidden;border:1px solid var(--line);background:#E6E3DC}
.mapa iframe{width:100%;height:100%;min-height:22rem;border:0;display:block}
@media (max-width:860px){.kontakt{grid-template-columns:1fr}}

/* pätička */
.foot{background:var(--ink);color:#C9CFDB;padding-block:3rem;font-size:.88rem}
.foot__in{display:grid;gap:1.1rem}
.foot__logo{width:min(100%,19rem);height:auto;margin-bottom:.5rem}
.foot a{display:inline-flex;align-items:center;min-height:var(--prst);color:var(--paper)}

/* pohyb */
.js .odhal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .odhal.is-in{opacity:1;transform:none}
.js .pegas{opacity:0;transform:translateX(-24px);transition:opacity .9s ease .15s,transform .9s cubic-bezier(.2,.7,.2,1) .15s}
.js .is-ready .pegas{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .odhal,.js .pegas{opacity:1 !important;transform:none !important;transition:none !important}
  .valec__piest,.sluzby li{transition:none}
}
