/* ========= RESET & BASE ========= */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:104px;-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;color:#111;background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:none;background:none}
ul,ol{list-style:none}

:root{
  --yellow:#1B5688;       /* světlá chladná patina (báň + kámen věže) – hlavní akcent */
  --yellow-2:#134266;     /* střední břidlicová – hover, hloubka */
  --black:#0a0a0a;
  --ink:#111;
  --dark:#15171a;
  --dark-2:#1d2024;
  --line:#2a2d31;
  --muted:#8a8f96;
  --white:#fff;
  --radius:4px;
  --radius-btn:7px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --container:1200px;
}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.header a:focus-visible,.section--yellow a:focus-visible,.sticky-btn--phone:focus-visible{outline-color:var(--black)}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--black);color:var(--yellow);padding:12px 20px;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:14px}
.skip-link:focus{left:0}

.ico{width:1em;height:1em;flex-shrink:0;vertical-align:-.12em}

.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.narrow{max-width:880px;margin:0 auto}
.small{font-size:14px}
.muted{color:var(--muted)}

/* ========= TYPO ========= */
h1,h2,h3,h4,.h2{font-family:'Anton','Oswald',sans-serif;font-weight:400;letter-spacing:.5px;line-height:1.05;text-transform:uppercase}
h1{font-size:clamp(40px,7vw,88px)}
.h2{font-size:clamp(32px,4.5vw,56px);margin-bottom:16px}
h3{font-size:22px;letter-spacing:.3px}
.lead{font-size:18px;color:#444;max-width:760px;margin-bottom:32px}
.eyebrow{display:inline-block;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:#666;margin-bottom:14px}
.eyebrow--yellow{color:var(--yellow);position:relative;padding-left:36px}
.eyebrow--yellow::before{content:"";position:absolute;left:0;top:50%;width:24px;height:2px;background:var(--yellow);transform:translateY(-50%)}
.eyebrow--black{color:var(--black);padding-left:36px;position:relative}
.eyebrow--black::before{content:"";position:absolute;left:0;top:50%;width:24px;height:2px;background:var(--black);transform:translateY(-50%)}

/* ========= BUTTONS ========= */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:16px 30px;font-family:'Oswald',sans-serif;font-weight:600;font-size:16px;letter-spacing:1.5px;text-transform:uppercase;border-radius:var(--radius-btn);transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease),color .2s var(--ease),border-color .25s var(--ease);cursor:pointer;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.985)}
.btn .ico{transition:transform .25s var(--ease)}
.btn--primary{background:var(--yellow);color:var(--black);box-shadow:0 4px 14px rgba(27,86,136,.3),0 1px 3px rgba(0,0,0,.18)}
.btn--primary:hover{background:var(--yellow-2);box-shadow:0 10px 26px rgba(27,86,136,.45),0 3px 8px rgba(0,0,0,.22)}
.btn--ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.btn--ghost:hover{background:#fff;color:var(--black);border-color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.25)}
.section:not(.section--dark):not(.section--cta) .btn--ghost{color:var(--black);border-color:rgba(0,0,0,.45)}
.section:not(.section--dark):not(.section--cta) .btn--ghost:hover{background:var(--black);color:#fff;border-color:var(--black)}
.btn--yellow{background:var(--yellow);color:var(--black);box-shadow:0 4px 14px rgba(27,86,136,.3),0 1px 3px rgba(0,0,0,.18)}
.btn--yellow:hover{background:var(--yellow-2);box-shadow:0 10px 26px rgba(27,86,136,.45),0 3px 8px rgba(0,0,0,.22)}
.btn--dark{background:var(--black);color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.28)}
.btn--dark:hover{background:#222;box-shadow:0 10px 26px rgba(0,0,0,.4)}
.btn--outline-dark{background:transparent;color:var(--black);border:1.5px solid rgba(0,0,0,.6)}
.btn--outline-dark:hover{background:var(--black);color:#fff;border-color:var(--black);box-shadow:0 8px 22px rgba(0,0,0,.25)}
.btn--block{width:100%}
.btn--large{padding:20px 42px;font-size:18px}
.btn--phone-sm{background:var(--black);color:var(--yellow);padding:10px 18px;font-size:14px;letter-spacing:1px;border:2px solid var(--black);box-shadow:0 2px 8px rgba(0,0,0,.25)}
.btn--phone-sm:hover{background:var(--dark-2)}
/* tlačítka s ikonou telefonu – jemný „zazvonění" náklon ikony na hover (decentní) */
.btn:hover .ico{transform:scale(1.08)}

/* ========= TOPBAR ========= */
.topbar{background:#000;color:#fff;font-size:13px;border-bottom:1px solid #222}
.topbar__inner{display:flex;gap:24px;justify-content:flex-end;align-items:center;padding:10px 24px;flex-wrap:wrap}
.topbar__item{color:#ddd;letter-spacing:.5px}
.topbar__phone strong{color:var(--yellow)}
.topbar__loc{color:#888}

/* ========= HEADER ========= */
.header{background:var(--yellow);position:sticky;top:0;z-index:50;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.header__inner{display:flex;align-items:center;gap:24px;padding:10px 24px;min-height:80px}
.logo img{height:64px;width:auto}
.logo__text{display:flex;flex-direction:column;gap:2px;line-height:1.15;padding-left:14px;white-space:nowrap}
.logo__text strong{font-family:'Oswald',sans-serif;font-weight:700;font-size:17px;letter-spacing:1px;text-transform:uppercase;color:var(--black)}
.logo__text span{display:none;font-family:'Oswald',sans-serif;font-weight:500;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(0,0,0,.65)}
.nav{display:flex;gap:22px;margin-left:auto;font-family:'Oswald',sans-serif;font-weight:500;text-transform:uppercase;letter-spacing:1px;font-size:14px}
.nav a{position:relative;padding:6px 0;color:var(--black);white-space:nowrap}
.nav a:hover{color:#000}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--black);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav a:hover::after{transform:scaleX(1)}
.nav-toggle{display:none;flex-direction:column;gap:5px;padding:8px;margin-left:auto}
.nav-toggle span{display:block;width:26px;height:3px;background:#000;border-radius:2px}

/* ========= HERO ========= */
.hero{position:relative;min-height:90vh;display:flex;align-items:center;overflow:hidden;color:#fff;padding:80px 0}
.hero__bg{position:absolute;inset:0;background-size:cover;background-position:30% center;filter:contrast(1.03) saturate(1.04)}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(102deg,rgba(11,18,30,.86) 0%,rgba(11,18,30,.68) 34%,rgba(11,18,30,.42) 60%,rgba(11,18,30,.26) 100%),linear-gradient(180deg,rgba(11,18,30,.1) 0%,rgba(11,18,30,.36) 62%,rgba(11,18,30,.66) 100%)}
.hero__ghost{position:absolute;left:-2vw;top:50%;transform:translateY(-50%);font-family:'Anton',sans-serif;font-size:clamp(180px,28vw,400px);color:transparent;-webkit-text-stroke:2px rgba(27,86,136,.55);letter-spacing:8px;line-height:.9;pointer-events:none;user-select:none;z-index:1;white-space:nowrap}
.hero__inner{position:relative;z-index:2;max-width:980px;width:100%;min-width:0;animation:heroUp .7s cubic-bezier(.22,.61,.36,1) both}
@keyframes heroUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.hero .eyebrow{color:var(--yellow);padding-left:36px;position:relative}
.hero .eyebrow::before{content:"";position:absolute;left:0;top:50%;width:24px;height:2px;background:var(--yellow);transform:translateY(-50%)}
.hero h1{color:#fff;margin-bottom:24px;text-shadow:0 4px 30px rgba(0,0,0,.5)}
.hero__mark{background:var(--yellow);color:#000;padding:0 12px;display:inline-block}
.hero__sub{font-size:clamp(16px,1.4vw,19px);color:#e5e5e5;max-width:760px;margin-bottom:36px}
.hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:48px}
.hero__usps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;border-top:1px solid rgba(255,255,255,.15);padding-top:28px}
.hero__usps li{font-size:13px;color:#ccc;text-transform:uppercase;letter-spacing:1px;line-height:1.45}
.hero__usps strong{display:block;font-family:'Anton',sans-serif;font-size:32px;color:var(--yellow);letter-spacing:1px;margin-bottom:6px}
.hero__refs{margin-top:28px;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#9aa0a6}

/* ========= STRIP ========= */
.strip{background:#000;color:#fff;padding:18px 0;border-top:4px solid var(--yellow)}
.strip__inner{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-around;align-items:center;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:14px;color:#ccc}
.strip__inner span{position:relative;padding-left:22px}
.strip__inner span::before{content:"▲";color:var(--yellow);position:absolute;left:0;top:0;font-size:11px}

/* ========= SECTIONS ========= */
.section{padding:100px 0}
.section--dark{background:var(--dark);color:#eaeaea}
.section--dark .lead{color:#b9bdc2}
.section--dark p{color:#c8ccd1}
.section--yellow{background:var(--yellow);color:#000}
.section--yellow .lead,.section--yellow p{color:#1a1a1a}
.h2--black{color:#000}
.section--cta{background:linear-gradient(135deg,var(--dark) 0%,var(--black) 100%);color:#fff}
.section--cta p,.section--cta .lead{color:#cfd2d6}

/* ========= CARDS ========= */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:48px}
.card{background:var(--dark-2);border:1px solid #2a2d31;border-radius:6px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,border-color .25s}
.card:hover{transform:translateY(-6px);border-color:var(--yellow)}
.card--featured{border-color:var(--yellow);position:relative;box-shadow:0 20px 60px rgba(27,86,136,.15)}
.card__badge{position:absolute;top:16px;right:16px;background:var(--yellow);color:#000;font-family:'Oswald',sans-serif;font-weight:700;font-size:12px;letter-spacing:1.5px;padding:6px 12px;text-transform:uppercase;z-index:2;border-radius:2px}
.card__img{height:220px;background-size:cover;background-position:center;border-bottom:3px solid var(--yellow)}
.card__body{padding:28px;display:flex;flex-direction:column;gap:14px;flex:1}
.card__body h3{color:#fff;font-size:28px}
.card .price{font-family:'Oswald',sans-serif}
.card .price strong{font-size:32px;color:var(--yellow);font-weight:700;letter-spacing:1px}
.card .price span{color:#9aa0a6;font-size:14px;text-transform:uppercase;letter-spacing:1.5px;margin-left:6px}
.card__meta{font-family:'Oswald',sans-serif;font-size:12.5px;letter-spacing:1.5px;text-transform:uppercase;color:#9aa0a6;border-top:1px solid #2a2d31;border-bottom:1px solid #2a2d31;padding:10px 0;flex:none !important}
/* opakovací školení – decentně odlišený panel */
.course-repeat{margin-top:24px;display:flex;gap:32px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:30px 32px;background:var(--dark-2);border:1px solid #2a2d31;border-top:3px solid var(--yellow);border-radius:6px;transition:border-color .25s}
.course-repeat:hover{border-color:var(--yellow)}
.course-repeat__info{display:flex;flex-direction:column;gap:10px;flex:1;min-width:min(260px,100%)}
.course-repeat__info h3{color:#fff;font-size:24px}
.course-repeat__info p{color:#b9bdc2;font-size:15px;max-width:560px}
.course-repeat__action{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.course-repeat .price{font-family:'Oswald',sans-serif;white-space:nowrap}
.course-repeat .price strong{font-size:30px;color:var(--yellow);font-weight:700;letter-spacing:1px}
.course-repeat .price span{color:#9aa0a6;font-size:13px;text-transform:uppercase;letter-spacing:1.5px;margin-left:6px}
.card p{color:#b9bdc2;font-size:15px;flex:1}
.card .btn{margin-top:auto}

.callout{margin-top:56px;background:var(--black);border-left:6px solid var(--yellow);padding:32px 36px;display:flex;flex-direction:column;gap:14px;align-items:flex-start;border-radius:4px}
.callout h3{color:var(--yellow);font-size:26px}
.callout p{color:#d5d9de;max-width:720px}

/* ========= SPLIT ========= */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.split__media{min-height:480px;background-size:cover;background-position:center;border-radius:4px;border:3px solid var(--yellow);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.split__media--portrait{aspect-ratio:1086/1184;min-height:0;background-position:center top}
.split__content p:not(:last-child){margin-bottom:14px}
#nv p:not(:last-child){margin-bottom:14px}
.split__content .h2{color:inherit}
.section--dark .split__content .h2{color:#fff}
.checklist{margin:24px 0 32px;display:grid;gap:12px}
.checklist li{position:relative;padding-left:32px;color:#3c4146;font-size:16px}
.section--dark .checklist li{color:#c8ccd1}
.checklist li::before{content:"";position:absolute;left:0;top:8px;width:18px;height:18px;background:var(--yellow);clip-path:polygon(14% 44%,0 65%,40% 100%,100% 16%,86% 0,38% 68%);filter:drop-shadow(.7px 0 0 #0a0a0a) drop-shadow(-.7px 0 0 #0a0a0a) drop-shadow(0 .7px 0 #0a0a0a) drop-shadow(0 -.7px 0 #0a0a0a)}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.cta-row--spaced{margin-top:40px}

/* ========= REFERENCE ========= */
.section--refs{background:#101214;border-top:1px solid #232629}
.refs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}
.ref{display:flex;flex-direction:column;gap:8px;padding:28px 26px;background:rgba(255,255,255,.03);border:1px solid #2a2d31;border-top:3px solid var(--yellow);border-radius:4px;transition:background .25s,border-color .25s}
.ref:hover{background:rgba(27,86,136,.06);border-color:var(--yellow)}
.ref__name{font-family:'Oswald',sans-serif;font-weight:600;font-size:19px;letter-spacing:.5px;text-transform:uppercase;color:#fff}
.ref__tag{font-family:'Oswald',sans-serif;font-size:12.5px;letter-spacing:2px;text-transform:uppercase;color:#9aa0a6}

.ai-excerpt{margin-top:28px;padding:18px 22px;background:rgba(27,86,136,.1);border-left:4px solid var(--yellow);font-size:14px;color:#4a4f54 !important;border-radius:2px}
.section--dark .ai-excerpt{background:rgba(27,86,136,.08);color:#b9bdc2 !important}

/* ========= GRID 4 ========= */
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:48px}
.feat{background:rgba(255,255,255,.03);border:1px solid #2a2d31;padding:28px 24px;border-radius:4px;transition:background .25s,border-color .25s}
.feat:hover{background:rgba(27,86,136,.06);border-color:var(--yellow)}
.feat__num{font-family:'Anton',sans-serif;color:var(--yellow);font-size:42px;margin-bottom:8px;letter-spacing:1px}
.feat h3{color:#fff;font-size:20px;margin-bottom:8px}
.feat p{color:#b9bdc2;font-size:14px;line-height:1.55}

/* ========= STEPS ========= */
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;margin-top:48px;counter-reset:step}
.steps li{position:relative;padding:28px 22px;background:#fafafa;border-top:4px solid var(--yellow);border-radius:4px}
.steps li span{font-family:'Anton',sans-serif;color:var(--yellow);font-size:48px;display:block;line-height:1;margin-bottom:12px;-webkit-text-stroke:1px #000}
.steps li h3{font-size:18px;margin-bottom:8px}
.steps li p{font-size:14px;color:#555}

/* ========= TERMÍNY ========= */
.terminy{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}
.termin{background:#000;color:#fff;padding:32px 28px;border-radius:4px;border-left:6px solid #fff}
.termin h3{color:var(--yellow);font-size:24px;margin-bottom:14px}
.termin p{color:#ddd;font-size:16px}
.termin__tags{display:flex;flex-wrap:wrap;gap:8px}
.termin__tag{display:inline-flex;align-items:center;gap:8px;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#e7e7e7;border:1px solid rgba(255,255,255,.25);padding:7px 12px;border-radius:2px}
.termin__tag b{color:#000;background:var(--yellow);font-weight:700;padding:1px 7px;border-radius:2px;letter-spacing:1px}
.termin__tag b.op{background:#fff;color:#000;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}

/* ========= KNOWLEDGE ========= */
.kb{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}
.kb article{padding:24px;border:1px solid #eee;border-left:4px solid var(--yellow);background:#fafafa;border-radius:2px}
.kb h3{font-size:18px;margin-bottom:8px;color:#000}
.kb p{font-size:14px;color:#555;line-height:1.6}

/* ========= FORM ========= */
.form{margin-top:32px;display:grid;grid-template-columns:minmax(0,1fr);gap:18px;background:rgba(255,255,255,.04);padding:32px;border-radius:6px;border:1px solid rgba(255,255,255,.1)}
.form__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.form label{display:flex;flex-direction:column;gap:6px;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--yellow);min-width:0}
.form input,.form select,.form textarea{width:100%;min-width:0;font-family:'Inter',sans-serif;font-size:16px;padding:14px 16px;background:#fff;color:#111;border:2px solid transparent;border-radius:3px;outline:none;letter-spacing:0;text-transform:none;font-weight:400}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--yellow);box-shadow:0 0 0 4px rgba(27,86,136,.2)}
.form .check{flex-direction:row;align-items:center;gap:10px;color:#cfd2d6;font-family:'Inter',sans-serif;font-size:14px;letter-spacing:0;text-transform:none}
.form .check input{width:18px;height:18px;padding:0}

/* ========= FAQ ========= */
.faq{margin-top:40px;display:grid;gap:10px}
.faq details{background:#fafafa;border:1px solid #ececec;border-left:4px solid var(--yellow);border-radius:2px;transition:background .2s}
.faq details[open]{background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.06)}
.faq summary{cursor:pointer;padding:20px 24px;font-family:'Oswald',sans-serif;font-weight:600;font-size:17px;color:#000;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:28px;color:var(--black);font-weight:300;transition:transform .2s;flex-shrink:0}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 24px 22px;color:#444;font-size:15px}

/* ========= CONTACT ========= */
.contact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}
.contact__card{display:flex;flex-direction:column;gap:8px;padding:32px 28px;background:var(--black);border:1px solid #2a2d31;border-radius:4px;transition:border-color .25s,transform .25s}
.contact__card[href]:hover{border-color:var(--yellow);transform:translateY(-4px)}
.contact__label{font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:#8a8f96}
.contact__value{font-family:'Anton',sans-serif;font-size:28px;color:#fff;letter-spacing:.5px}
.contact__value--email{font-size:21px;word-break:break-word;text-transform:lowercase}
.contact__cta{margin-top:8px;font-family:'Oswald',sans-serif;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;color:var(--yellow)}

/* Firemní / fakturační údaje (kontaktní sekce) */
.bizinfo{margin-top:24px;padding:26px 28px;background:var(--dark-2,#121417);border:1px solid var(--line);border-radius:var(--radius);position:relative;overflow:hidden}
.bizinfo::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--yellow),var(--yellow-2))}
.bizinfo__title{font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--yellow);margin-bottom:18px}
.bizinfo__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 32px}
.bizinfo__row{display:flex;flex-direction:column;gap:3px;min-width:0}
.bizinfo__row dt{font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:#8a8f96}
.bizinfo__row dd{font-family:'Oswald',sans-serif;font-weight:600;font-size:17px;letter-spacing:.4px;color:#fff;word-break:break-word}
.bizinfo__link{display:inline-flex;align-items:center;gap:9px;margin-top:20px;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;letter-spacing:.6px;
  color:var(--yellow);text-decoration:none;border-bottom:1px solid rgba(27,86,136,.4);padding-bottom:2px;
  transition:color .2s var(--ease),border-color .2s var(--ease)}
.bizinfo__link:hover{color:#c6dadb;border-bottom-color:var(--yellow)}
.bizinfo__link .ico{width:18px;height:18px;flex:none}
@media (max-width:600px){
  .bizinfo{padding:22px 20px}
  .bizinfo__grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .bizinfo__link{font-size:13px}
}

/* ========= FOOTER ========= */
.footer{background:#000;color:#aaa;padding:60px 0 0}
.footer__inner{display:grid;grid-template-columns:2fr minmax(0,1fr) minmax(0,1fr);gap:48px}
.footer h4{color:var(--yellow);font-size:18px;margin-bottom:14px}
.footer ul{display:grid;gap:8px}
.footer a:hover{color:var(--yellow)}
.footer img{margin-bottom:16px}
.footer__logo{width:210px;max-width:62%;height:auto;display:block}
.footer p{color:#aaa;font-size:14px;margin-bottom:10px}
.footer__bottom{margin-top:48px;padding:20px 0;border-top:1px solid var(--line);font-size:13px;color:#666}

/* ========= BAND – INDIVIDUÁLNÍ PŘÍSTUP ========= */
.band{background:var(--black);color:#eaeaea;padding:64px 0;border-top:4px solid var(--yellow)}
.band__inner{text-align:center}
.band .eyebrow--yellow{padding-left:0}
.band .eyebrow--yellow::before{display:none}
.h2--band{font-size:clamp(26px,3.2vw,40px);color:#fff;margin-bottom:14px}
.band p{color:#c8ccd1;max-width:720px;margin:0 auto;font-size:17px}

/* ========= STICKY MOBILNÍ CTA (výměna „Volné termíny" ⇄ telefon) ========= */
.sticky-bar{display:none}
@media (max-width:680px){
  .sticky-bar{
    display:block;position:fixed;left:16px;right:16px;bottom:16px;
    height:56px;z-index:60;
  }
}
.sticky-btn{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-family:'Oswald',sans-serif;font-weight:700;letter-spacing:1.5px;
  text-transform:uppercase;font-size:16px;border-radius:10px;
  opacity:0;transform:translateY(8px) scale(.99);pointer-events:none;
  transition:opacity .4s var(--ease),transform .4s var(--ease),box-shadow .3s var(--ease);
  will-change:opacity,transform;
}
.sticky-btn .ico{font-size:18px;transition:transform .25s var(--ease)}
.sticky-btn:active{transform:translateY(0) scale(.975)}
/* Telefonní – brandová žlutá */
.sticky-btn--phone{background:var(--yellow);color:#0a0a0a;box-shadow:0 8px 24px rgba(0,0,0,.35),0 2px 6px rgba(27,86,136,.25)}
/* Volné termíny – tmavá varianta se žlutým rámem (jasně odlišená, klidná) */
.sticky-btn--inquiry{
  background:var(--dark);color:var(--yellow);
  border:2px solid var(--yellow);
  box-shadow:0 8px 24px rgba(0,0,0,.4),0 0 16px rgba(27,86,136,.14);
}
/* Stav: zobrazeny Volné termíny – jemný jednorázový nástup */
.sticky-bar.is-inquiry .sticky-btn--inquiry{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;animation:stickyIn .45s var(--ease)}
.sticky-bar.is-inquiry .sticky-btn--inquiry:active .ico{transform:scale(1.1)}
/* Stav: zobrazen telefon – jemný jednorázový nástup */
.sticky-bar.is-phone .sticky-btn--phone{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;animation:stickyIn .45s var(--ease)}
@keyframes stickyIn{
  0%{opacity:0;transform:translateY(8px) scale(.99)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

/* První „Zavolat nyní" v hero (jen mobil): start tmavý, po prvním zobrazení
   CTA „Volné termíny" jemný přechod na brandovou žlutou */
@media (max-width:680px){
  .hero__cta .btn--primary{
    background:var(--dark-2);color:#fff;
    box-shadow:0 6px 20px rgba(0,0,0,.4);
    transition:background .55s var(--ease),color .55s var(--ease),box-shadow .55s var(--ease),transform .25s var(--ease);
  }
  .hero__cta .btn--primary.hero-call--activate{
    background:var(--yellow);color:var(--black);
    box-shadow:0 6px 20px rgba(27,86,136,.35),0 2px 6px rgba(0,0,0,.2);
    animation:heroCallPop .55s cubic-bezier(.34,1.4,.5,1);
  }
}
@keyframes heroCallPop{
  0%{transform:scale(1)}
  45%{transform:scale(1.045)}
  100%{transform:scale(1)}
}

/* ========= RESPONSIVE ========= */
@media (max-width:1320px){
  .nav{gap:16px;font-size:13.5px;letter-spacing:.8px}
  .header__inner{gap:16px}
}
@media (max-width:1300px){
  .logo__text{display:none}
}
@media (max-width:1024px){
  .logo__text{display:flex}
  .logo__text span{display:block}
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kb{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kb article:last-child{grid-column:1/-1}
  .steps{grid-template-columns:minmax(0,1fr);max-width:680px;margin-left:auto;margin-right:auto;gap:14px}
  .steps li{display:grid;grid-template-columns:64px 1fr;column-gap:20px;align-items:start;border-top:none;border-left:4px solid var(--yellow);padding:22px 24px}
  .steps li span{font-size:40px;margin-bottom:0;grid-row:1/3}
  .steps li h3{margin-bottom:6px}
  .cards{grid-template-columns:minmax(0,1fr);max-width:560px;margin-left:auto;margin-right:auto}
  .terminy,.contact{grid-template-columns:minmax(0,1fr);max-width:560px;margin-left:auto;margin-right:auto}
  .refs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split{grid-template-columns:1fr;gap:32px}
  .split__media{min-height:340px}
  .split__media--portrait{aspect-ratio:1086/1184;min-height:0;max-width:430px;margin-left:auto;margin-right:auto;width:100%}
  .footer__inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .footer__inner > div:first-child{grid-column:1/-1}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--yellow);flex-direction:column;padding:20px 24px;gap:18px;border-top:2px solid #000;box-shadow:0 16px 30px rgba(0,0,0,.18)}
  .nav.open{display:flex}
  .nav-toggle{display:flex}
  .header{position:sticky;top:0}
  .btn--phone-sm{display:none}
  .logo__text strong{font-size:15px}
  .logo__text span{font-size:11px}
  html{scroll-padding-top:64px}
}
@media (max-width:680px){
  .section{padding:64px 0}
  .hero{min-height:auto;padding:26px 0 48px}
  .hero h1{margin-bottom:20px}
  .hero__cta{margin-bottom:40px}
  .hero__usps{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;padding-top:24px}
  .hero__usps li{hyphens:auto;overflow-wrap:break-word}
  .hero__usps strong{font-size:28px}
  .hero__refs{margin-top:24px;font-size:12px;line-height:1.7}
  .kb,.grid-4,.steps,.refs,.footer__inner{grid-template-columns:minmax(0,1fr)}
  .form__row{grid-template-columns:minmax(0,1fr)}
  .strip__inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px;font-size:12.5px;letter-spacing:1.5px}
  .feat{display:grid;grid-template-columns:56px 1fr;column-gap:16px;align-items:start;padding:20px}
  .feat__num{font-size:30px;margin-bottom:0;grid-row:1/3;line-height:1.1}
  .feat h3{margin-bottom:4px}
  .feat p{grid-column:2}
  .footer__inner > div:first-child{grid-column:auto}
  .h2{margin-bottom:14px}
  .lead{font-size:17px;margin-bottom:26px}
  .topbar__inner{justify-content:center;font-size:12px;gap:8px 16px;padding:8px 16px}
  .topbar__loc{display:none}
  body{padding-bottom:84px}
  .hero__ghost{font-size:40vw}
  .callout{padding:24px;border-left-width:4px}
  .callout .btn{width:100%}
  .course-repeat{padding:24px 20px;gap:18px}
  .course-repeat__info h3{font-size:22px}
  .course-repeat__action{width:100%;align-items:stretch;gap:12px;padding-top:18px;border-top:1px solid #2a2d31}
  .course-repeat__action .price{display:flex;align-items:baseline;justify-content:space-between}
  .course-repeat__action .btn{width:100%}
  .band{padding:52px 0}
  .band p{font-size:16px}
  .form{padding:22px 18px}
  .btn--large{padding:18px 28px;font-size:16px}
  .steps li{grid-template-columns:52px 1fr;column-gap:16px;padding:20px}
  .steps li span{font-size:34px}
  .contact__value{font-size:24px}
  .contact__value--email{font-size:18px}
  .faq summary{padding:16px 18px;font-size:16px}
  .faq details p{padding:0 18px 18px}
}
@media (max-width:480px){
  .hero__cta .btn{width:100%}
  .header__inner{gap:12px}
  .cta-row .btn{width:100%}
  .logo img{height:52px}
  .logo__text{padding-left:12px}
  .logo__text strong{font-size:13.5px;letter-spacing:.5px}
  .logo__text span{display:none}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn,.card,.feat,.contact__card,.ref,.nav a::after{transition:none}
  .btn:hover,.card:hover,.contact__card[href]:hover{transform:none}
  .btn:hover .ico,.sticky-btn:active .ico{transform:none}
  .sticky-btn{transition:none;animation:none}
  .sticky-bar.is-inquiry .sticky-btn--inquiry,.sticky-bar.is-phone .sticky-btn--phone{animation:none}
  .hero__inner{animation:none}
  .hero__cta .btn--primary{background:var(--yellow);color:var(--black);transition:none}
  .hero__cta .btn--primary.hero-call--activate{animation:none}
}

/* Úprava 2026-06-09: sjednocení pozadí loga s horní lištou */
.logo{display:flex;align-items:center;background:transparent;padding:0;border-radius:0;line-height:0;flex-shrink:0}
.logo img{display:block;background:transparent}

@media (max-width:360px){
  .logo__text strong{font-size:12px;letter-spacing:.3px}
  .logo img{height:46px}
}
@media (max-width:330px){
  .logo__text{display:none}
}
@media (max-width:340px){
  .h2{font-size:26px;overflow-wrap:break-word}
  h1{font-size:34px}
}

/* ============================================================
   ÚPRAVA 2026-06-14 — modernizace v12.2
   1) Prémiový scroll efekt CTA „Zavolat nyní"
   2) Mobilní „dot" navigace (tři tečky u pravého okraje)
   3) Decentní mikrointerakce
   ============================================================ */

/* ---------- 1) CTA „ZAVOLAT NYNÍ" – prémiový efekt při scrollu ---------- */
/* Decentní lesklý přejezd při vstupu tlačítka do viewportu + jemné
   „dýchání" stínu, dokud je CTA na obrazovce. Nikdy agresivní. */
.btn--call{position:relative;overflow:hidden;isolation:isolate}
.btn--call::after{
  content:"";position:absolute;top:-20%;bottom:-20%;left:-75%;width:55%;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.5) 50%,transparent 100%);
  transform:skewX(-18deg);opacity:0;pointer-events:none;z-index:3;
  mix-blend-mode:soft-light;
}
.btn--call.cta-reveal::after{animation:ctaSheen 1.1s var(--ease) .12s 1}
@keyframes ctaSheen{
  0%{left:-75%;opacity:0}
  12%{opacity:1}
  60%{opacity:1}
  100%{left:135%;opacity:0}
}
/* Jemné, pomalé „dýchání" stínu, jen když je CTA viditelné (nerušivé) */
.btn--call.cta-inview{animation:ctaBreath 3.6s ease-in-out infinite}
.btn--call.cta-inview:hover,.btn--call.cta-inview:focus-visible,
.btn--call.cta-inview:active{animation:none}
@keyframes ctaBreath{
  0%,100%{box-shadow:0 4px 14px rgba(27,86,136,.30),0 1px 3px rgba(0,0,0,.18)}
  50%{box-shadow:0 9px 26px rgba(27,86,136,.46),0 2px 8px rgba(0,0,0,.22)}
}

/* ---------- 3) Mikrointerakce – jemný zoom obrázku karty ---------- */
.card__img{transition:transform .45s var(--ease)}
.card:hover .card__img{transform:scale(1.045)}

/* ---------- 2) MOBILNÍ „DOT" NAVIGACE ---------- */
.dotnav{display:none}
@media (max-width:680px){
  .dotnav{display:block}

  /* Spouštěč – tři nenápadné tečky u pravého okraje, svisle na střed */
  .dotnav__trigger{
    position:fixed;top:88px;right:0;z-index:62;
    transform:translateX(10px);
    width:42px;height:74px;display:flex;align-items:center;justify-content:center;
    background:transparent;border:0;border-radius:16px 0 0 16px;
    opacity:0;pointer-events:none;-webkit-tap-highlight-color:transparent;
    transition:opacity .55s var(--ease),transform .55s var(--ease);
  }
  .dotnav.is-ready .dotnav__trigger{opacity:1;pointer-events:auto;transform:translateX(0)}
  .dotnav__dots{display:flex;flex-direction:column;gap:7px;padding:4px 0}
  .dotnav__dots i{
    width:6px;height:6px;border-radius:50%;background:#0a0a0a;opacity:.30;
    box-shadow:0 0 0 1px rgba(255,255,255,.28);
    transition:opacity .3s var(--ease),transform .35s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease);
  }
  /* Adaptivní kontrast – nad tmavými sekcemi tečky zežloutnou */
  .dotnav.on-dark .dotnav__dots i{background:var(--yellow);opacity:.42;box-shadow:0 0 0 1px rgba(0,0,0,.35)}
  .dotnav__trigger:hover .dotnav__dots i,
  .dotnav__trigger:focus-visible .dotnav__dots i{opacity:.9}
  .dotnav__trigger:active{transform:translateX(0) scale(.93)}

  /* Otevřený stav – tečky se rozestoupí (náznak „aktivní") */
  .dotnav.is-open .dotnav__dots i{opacity:.95}
  .dotnav.is-open .dotnav__dots i:nth-child(1){transform:translateY(7px)}
  .dotnav.is-open .dotnav__dots i:nth-child(3){transform:translateY(-7px)}

  /* Zatmavení pozadí */
  .dotnav__scrim{
    position:fixed;inset:0;z-index:65;background:rgba(8,9,11,.52);
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .35s var(--ease),visibility .35s var(--ease);
  }
  .dotnav.is-open .dotnav__scrim{opacity:1;visibility:visible;pointer-events:auto}

  /* Vysouvací panel navigace */
  .dotnav__panel{
    position:fixed;top:0;right:0;bottom:0;z-index:70;
    width:min(84vw,322px);
    background:linear-gradient(160deg,var(--dark) 0%,var(--black) 100%);
    border-left:3px solid var(--yellow);
    box-shadow:-22px 0 56px rgba(0,0,0,.5);
    padding:26px 22px calc(22px + env(safe-area-inset-bottom)) 24px;
    display:flex;flex-direction:column;
    transform:translateX(106%);pointer-events:none;
    transition:transform .42s var(--ease);
    overflow-y:auto;overscroll-behavior:contain;
  }
  .dotnav.is-open .dotnav__panel{transform:translateX(0);pointer-events:auto}
  .dotnav__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
  .dotnav__title{
    font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:3px;
    text-transform:uppercase;color:var(--yellow);margin:0;padding-left:2px}
  .dotnav__close{
    flex:0 0 auto;width:40px;height:40px;display:flex;align-items:center;justify-content:center;
    border-radius:50%;background:rgba(255,255,255,.06);color:#e9eaec;
    font-size:26px;line-height:1;border:1px solid rgba(255,255,255,.12);
    -webkit-tap-highlight-color:transparent;
    transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease)}
  .dotnav__close span{margin-top:-3px}
  .dotnav__close:hover,.dotnav__close:focus-visible{background:var(--yellow);color:#0a0a0a;border-color:var(--yellow)}
  .dotnav__close:active{transform:scale(.92)}
  .dotnav__close-btn{
    margin-top:12px;width:100%;padding:13px 18px;border-radius:10px;
    background:transparent;color:#cfd2d6;border:1.5px solid rgba(255,255,255,.22);
    font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;
    -webkit-tap-highlight-color:transparent;
    transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
  .dotnav__close-btn:hover,.dotnav__close-btn:focus-visible{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.4)}
  .dotnav__close-btn:active{background:rgba(255,255,255,.1)}
  .dotnav__list{display:flex;flex-direction:column;gap:2px;margin-bottom:20px}
  .dotnav__list a{
    display:block;padding:13px 14px;border-radius:9px;position:relative;
    font-family:'Oswald',sans-serif;font-weight:500;font-size:17px;letter-spacing:.6px;color:#e9eaec;
    transition:background .2s var(--ease),color .2s var(--ease),padding-left .2s var(--ease)}
  .dotnav__list a::before{
    content:"";position:absolute;left:6px;top:50%;width:3px;height:58%;
    background:var(--yellow);border-radius:2px;
    transform:translateY(-50%) scaleY(0);transform-origin:center;
    transition:transform .22s var(--ease)}
  .dotnav__list a:hover,.dotnav__list a:active{background:rgba(255,255,255,.05);padding-left:20px}
  .dotnav__list a.is-current{color:var(--yellow);background:rgba(27,86,136,.08);padding-left:20px}
  .dotnav__list a.is-current::before{transform:translateY(-50%) scaleY(1)}
  .dotnav__cta{
    margin-top:auto;display:flex;align-items:center;justify-content:center;text-align:center;
    padding:15px 18px;background:var(--yellow);color:#0a0a0a;border-radius:10px;
    font-family:'Oswald',sans-serif;font-weight:700;font-size:14.5px;letter-spacing:1.2px;text-transform:uppercase;
    box-shadow:0 6px 18px rgba(27,86,136,.3);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
  .dotnav__cta:hover{box-shadow:0 9px 24px rgba(27,86,136,.42)}
  .dotnav__cta:active{transform:scale(.98)}

  /* Zámek scrollu + skrytí spodního CTA, ať se nepřekrývají */
  body.dotnav-lock{overflow:hidden}
  body.dotnav-lock .sticky-bar{opacity:0;pointer-events:none;transition:opacity .25s var(--ease)}
}

/* ---------- Respektování prefers-reduced-motion ---------- */
@media (prefers-reduced-motion:reduce){
  .btn--call.cta-reveal::after{animation:none;opacity:0}
  .btn--call.cta-inview{animation:none}
  .card:hover .card__img{transform:none}
  .dotnav__trigger,.dotnav__panel,.dotnav__scrim,.dotnav__dots i{transition:none}
}

/* ============================================================
   ÚPRAVA 2026-06-14 — v15
   • úkol 1: mobilní hero CTA – čistý vertikální stack bez kolizí
   • úkol 2/12: odlišení opakovacího školení (doplňkové)
   ============================================================ */

/* Opakovací školení – kicker, který ho odlišuje od úrovní L1–L3 */
/* Mobilní hero: hlavní CTA „Zavolat nyní" a „Nezávazně poptat" se nesmí
   překrývat ani tlačit – čistý vertikální stack s jasným rozestupem. */
@media (max-width:680px){
  .hero__cta{flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:12px;margin-bottom:32px}
  .hero__cta .btn{width:100%}
}

/* ============================================================
   ÚPRAVA 2026-06-14 — v16
   • mini-galerie (slider) u karet školení L1 / L2 / L3
   • tlačítko tří teček – žlutý rámeček + pulz po 1. použití
   • cena opakovacího školení – „od 1 200 Kč“ / „bez DPH“ vlevo
   ============================================================ */

/* ---------- SLIDER U KARET ŠKOLENÍ ---------- */
/* Kontejner dědí pevnou výšku 220px z .card__img → žádný layout shift. */
.vps-slider{position:relative;overflow:hidden}
.vps-slider__track{position:absolute;inset:0}
.vps-slider__img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
  opacity:0;transform:scale(1);
  transition:opacity .9s var(--ease),transform .45s var(--ease);
  will-change:opacity;
}
/* Fallback bez JS / jediná fotka: zobrazí se první snímek */
.vps-slider__img:first-child{opacity:1}
/* Po startu JS řídí viditelnost přes .is-active */
.vps-slider.is-ready .vps-slider__img{opacity:0}
.vps-slider.is-ready .vps-slider__img.is-active{opacity:1}
/* Jemný zoom aktivní fotky při hoveru (nahrazuje původní zoom kontejneru) */
.card:hover .vps-slider{transform:none}
.card:hover .vps-slider__img.is-active{transform:scale(1.045)}

/* Indikátor – decentní průhledné kroužky, aktivní je žlutý */
.vps-slider__dots{
  position:absolute;left:0;right:0;bottom:11px;z-index:3;
  display:flex;gap:9px;justify-content:center;align-items:center;
}
.vps-slider__dot{
  width:9px;height:9px;border-radius:50%;padding:0;border:0;cursor:pointer;
  background:rgba(255,255,255,.32);
  box-shadow:0 0 0 1px rgba(0,0,0,.35),0 1px 4px rgba(0,0,0,.45);
  -webkit-tap-highlight-color:transparent;
  transition:background .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease);
}
.vps-slider__dot:hover{background:rgba(255,255,255,.55)}
.vps-slider__dot.is-active{
  background:var(--yellow);transform:scale(1.18);
  box-shadow:0 0 0 1px rgba(0,0,0,.5),0 0 8px rgba(27,86,136,.6);
}

/* ---------- TLAČÍTKO TŘÍ TEČEK – JEMNÝ ADAPTIVNÍ NÁZNAK ---------- */
.dotnav__trigger::after{
  content:"";position:absolute;top:18px;bottom:18px;left:9px;right:9px;
  border-radius:12px;border:1px solid transparent;
  box-shadow:0 0 0 0 rgba(27,86,136,0);
  pointer-events:none;
  transition:border-color .45s var(--ease),box-shadow .45s var(--ease);
}
/* Po prvním použití jen decentní, poloprůhledný náznak – bez výrazného glow,
   barva se přizpůsobuje pozadí (žlutá nad tmavým, jemný tmavý hairline nad světlým) */
.dotnav.is-visited .dotnav__trigger::after{
  border-color:rgba(18,20,23,.20);
  box-shadow:inset 0 0 5px rgba(18,20,23,.06);
}
.dotnav.is-visited.on-dark .dotnav__trigger::after{
  border-color:rgba(27,86,136,.30);
  box-shadow:inset 0 0 6px rgba(27,86,136,.10);
}
/* visited jen lehce zvýrazní tečky, barvu řídí adaptivní logika (on-dark) */
.dotnav.is-visited:not(.on-dark) .dotnav__trigger .dotnav__dots i{opacity:.5}
.dotnav.is-visited.on-dark .dotnav__trigger .dotnav__dots i{opacity:.6}
/* Krátké, jemné pulznutí po otevření/zavření – malý dosah, poloprůhledné */
.dotnav.is-pulse .dotnav__trigger::after{animation:dotnavPulse .7s var(--ease)}
@keyframes dotnavPulse{
  0%{box-shadow:0 0 0 0 rgba(27,86,136,.30)}
  60%{box-shadow:0 0 0 5px rgba(27,86,136,0)}
  100%{box-shadow:0 0 0 0 rgba(27,86,136,0)}
}

/* ---------- CENA OPAKOVACÍHO ŠKOLENÍ – STACK VLEVO ---------- */
.course-repeat__action .price.price--stack{
  display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;
  gap:2px;line-height:1.05;text-align:left;
}
.course-repeat .price--stack span{margin-left:0;text-align:left}

/* ---------- prefers-reduced-motion: tlumení pohybu ---------- */
@media (prefers-reduced-motion:reduce){
  .vps-slider__img{transition:opacity .001ms}
  .card:hover .vps-slider__img.is-active{transform:none}
  .vps-slider__dot{transition:none}
  .dotnav.is-pulse .dotnav__trigger::after{animation:none}
  .dotnav__trigger::after{transition:none}
}

/* ============================================================
   ÚPRAVA 2026-06-15 — v17
   • úkol 7: kompaktní header při scrollu (plynulé, s hysterezí)
   • úkol 5: kurzor pointer u prokliknutelného slideru
   ============================================================ */

/* ---------- úkol 7: KOMPAKTNÍ HEADER PŘI SCROLLU ---------- */
.header{transition:box-shadow .3s var(--ease),background-color .3s var(--ease)}
.header__inner{transition:min-height .3s var(--ease),padding-top .3s var(--ease),padding-bottom .3s var(--ease)}
.header .logo img{transition:width .3s var(--ease),height .3s var(--ease)}
.header .logo__text strong,.header .logo__text span{transition:font-size .3s var(--ease),opacity .3s var(--ease)}

.header.header--compact{box-shadow:0 4px 16px rgba(0,0,0,.18)}
.header.header--compact .header__inner{min-height:58px;padding-top:5px;padding-bottom:5px}
.header.header--compact .logo img{width:54px;height:54px}
.header.header--compact .logo__text span{opacity:.78}

@media (prefers-reduced-motion:reduce){
  .header,.header__inner,.header .logo img,
  .header .logo__text strong,.header .logo__text span{transition:none}
}

/* ---------- úkol 5: prokliknutelný / swipovatelný slider ---------- */
.vps-slider--interactive .vps-slider__track{cursor:pointer}

/* ============================================================
   ÚPRAVA 2026-06-15 — v18
   • úkol 1/4: řízení ořezu nových fotek v kartách (object-position)
   ============================================================ */
.vps-slider__img.img-focus-center{object-position:center center}
.vps-slider__img.img-focus-top{object-position:center 22%}
.vps-slider__img.img-focus-bottom{object-position:center 78%}
.vps-slider__img.img-focus-left{object-position:left center}
.vps-slider__img.img-focus-right{object-position:right center}

/* ============================================================
   ÚPRAVA 2026-06-16 — v19
   • animace fotky instruktora po kliknutí (zlatý ripple + glow)
   • dotnav: indikátor pozice na stránce + stav při tažení (drag-scroll)
   ============================================================ */

/* ---------- Fotka instruktora – jemná mikroanimace po kliknutí ---------- */
.instructor-photo{position:relative;cursor:pointer}
.instructor-photo::after{
  content:"";position:absolute;inset:-3px;border-radius:inherit;pointer-events:none;
  opacity:0;box-shadow:0 0 0 0 rgba(27,86,136,0);
}
.instructor-photo--pulse{animation:instrPulse .6s var(--ease)}
.instructor-photo--pulse::after{animation:instrRipple .65s var(--ease)}
@keyframes instrPulse{0%{transform:scale(1)}45%{transform:scale(1.02)}100%{transform:scale(1)}}
@keyframes instrRipple{
  0%{opacity:1;box-shadow:0 0 0 0 rgba(27,86,136,.55),0 0 20px rgba(27,86,136,.40)}
  100%{opacity:0;box-shadow:0 0 0 18px rgba(27,86,136,0),0 0 34px rgba(27,86,136,0)}
}

/* ---------- dotnav – stav při tažení (drag-scroll) ---------- */
.dotnav__trigger{touch-action:none}            /* drag-scroll řídí JS, brání dvojímu scrollu */
/* stav při vědomém tažení po tlačítku */
.dotnav.is-dragging .dotnav__trigger{transform:translateX(0) scale(1.05)}
.dotnav.is-dragging .dotnav__dots i{background:var(--yellow);opacity:.9}
.dotnav.is-dragging .dotnav__trigger::after{
  border-color:rgba(27,86,136,.38);
  box-shadow:inset 0 0 7px rgba(27,86,136,.14);
}

@media (prefers-reduced-motion:reduce){
  .instructor-photo--pulse,.instructor-photo--pulse::after{animation:none}
  .dotnav.is-dragging .dotnav__trigger{transform:translateX(0)}
}

/* ============================================================
   ÚPRAVA 2026-06-16 — v21
   • menu tečky jako pohyblivý jezdec (poloha = pozice na stránce)
   ============================================================ */
/* plynulý posun jezdce při běžném scrollu; při tažení drží přesně pod prstem */
.dotnav__trigger{transition:opacity .55s var(--ease),transform .55s var(--ease),top .12s ease-out}
.dotnav.is-dragging .dotnav__trigger{transition:opacity .55s var(--ease),transform .2s var(--ease),top 0s}
@media (prefers-reduced-motion:reduce){
  .dotnav__trigger{transition:opacity .55s var(--ease),transform .55s var(--ease),top 0s}
}

/* ============================================================
   ÚPRAVA 2026-06-16 — v22
   • štítek návaznosti kurzů v kartách L2 / L3
   ============================================================ */
.card__prereq{
  display:flex;align-items:center;gap:9px;
  font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:1.2px;
  text-transform:uppercase;font-weight:600;color:var(--yellow);
  margin-top:-2px;
}
.card__prereq::before{
  content:"";flex:none;width:16px;height:2px;border-radius:2px;
  background:var(--yellow);box-shadow:0 0 6px rgba(27,86,136,.5);
}

/* ============================================================
   ÚPRAVA 2026-06-16 — v23
   • mobil: skrytí nativního posuvníku (polohu ukazují tři tečky)
   ============================================================ */
@media (max-width:680px){
  html{scrollbar-width:none;-ms-overflow-style:none}
  html::-webkit-scrollbar,body::-webkit-scrollbar{width:0;height:0;display:none}
}

/* ============================================================
   ÚPRAVA 2026-06-17 — v24
   3) tenká žlutá linie mezi legislativou a poptávkou
   4) štítek „Základní školení" (sdílí .card__prereq – beze změny stylu)
   5) jemné odhalení FAQ položek
   6) autorská FAQ položka + sr-only (skrytá SEO věta)
   2) telefonní CTA na konci stránky – dočasný černý rámeček
   8) skrytí spodního navigačního bloku „Web" na mobilu
   ============================================================ */

/* 3) jemný oddělovač mezi #nv (legislativa) a #poptavka (formulář) */
#poptavka{position:relative}
#poptavka::before{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:min(440px,82%);height:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,rgba(27,86,136,.7),transparent);
  opacity:.9;pointer-events:none;
}

/* 5) FAQ – jemné odhalení (fade-up); bez JS/efektu zůstávají položky viditelné */
.faq details.faq-reveal{opacity:0;transform:translateY(12px)}
.faq details.faq-reveal--in{
  opacity:1;transform:none;
  transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.faq summary:hover{color:#111}
.faq details:hover{border-left-color:#1B5688}

/* 6) sr-only (přístupná, ale vizuálně skrytá SEO věta) */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* autorská FAQ položka – decentní žlutý akcent */
.faq details.faq__item--author{box-shadow:0 0 0 1px rgba(27,86,136,.35)}
.faq details.faq__item--author[open]{box-shadow:0 6px 22px rgba(0,0,0,.07),0 0 0 1px rgba(27,86,136,.5)}

/* 2) telefonní CTA na konci stránky – dočasný prémiový černý rámeček */
.contact__card--phone{transition:box-shadow .4s var(--ease),transform .4s var(--ease)}
.phone-cta--end-highlight{
  box-shadow:0 0 0 2px #0a0a0a,0 0 0 5px rgba(27,86,136,.45),0 14px 30px rgba(0,0,0,.18);
  animation:phoneEndPulse .7s var(--ease);
}
@keyframes phoneEndPulse{
  0%{box-shadow:0 0 0 0 #0a0a0a,0 0 0 0 rgba(27,86,136,0)}
  55%{box-shadow:0 0 0 3px #0a0a0a,0 0 0 8px rgba(27,86,136,.35)}
  100%{box-shadow:0 0 0 2px #0a0a0a,0 0 0 5px rgba(27,86,136,.45),0 14px 30px rgba(0,0,0,.18)}
}

@media (max-width:680px){
  /* 8) skrytí spodního navigačního bloku „Web" na mobilu */
  .footer__col-web{display:none}
}
@media (prefers-reduced-motion:reduce){
  .faq details.faq-reveal{opacity:1;transform:none}
  .contact__card--phone{transition:none}
  .phone-cta--end-highlight{animation:none}
}

/* ============================================================
   ÚPRAVA 2026-06-17 — v25
   IV) zrušení modrého zvýraznění prohlížeče po kliknutí na fotky
   V)  úplné odstranění žlutého rámečku kolem menu tří teček
   ============================================================ */
/* V) žádný rámeček kolem teček (v žádném stavu) – tečky i funkce zůstávají */
.dotnav__trigger::after{display:none!important}

/* IV) klik na fotky bez modrého tap-highlightu / modrého rámečku prohlížeče */
.instructor-photo,.vps-slider,.vps-slider__track,.vps-slider__img,
.split__media,.split__media--portrait{
  -webkit-tap-highlight-color:transparent;
}
.instructor-photo{outline:none;-webkit-user-select:none;user-select:none}
.instructor-photo:focus,.instructor-photo:focus-visible,
.vps-slider__img:focus,.vps-slider__track:focus{outline:none}

/* ============================================================
   ÚPRAVA 2026-06-17 — v26
   VI) tematické ikony + jemné oddělovače v horním menu (desktop)
   ============================================================ */
.nav a{display:inline-flex;align-items:center;gap:7px}
.nav__ico{width:1.22em;height:1.22em;opacity:.92;flex:none;
  transition:opacity .2s var(--ease),transform .25s var(--ease)}
.nav a:hover .nav__ico{opacity:1;transform:translateY(-1px)}
@media (min-width:1025px){
  /* Úkol – prémiovější, lépe čitelná horní lišta:
     větší a sytější písmo (škáluje s šířkou displeje, ale nepřeteče),
     výraznější ikony a decentní „pill" podsvit u aktivní položky. */
  .nav{gap:2px; font-size:clamp(13px, .42vw + 7.4px, 14px); font-weight:600; letter-spacing:.4px}
  .nav a{
    padding:9px 12px; gap:8px; border-radius:8px; color:#0a0a0a;
    transition:background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
  }
  .nav a:hover{background:rgba(0,0,0,.07); transform:translateY(-1px)}
  /* jemné svislé oddělovače – kratší, vystředěné, méně rušivé než plná linka */
  .nav a:not(:first-child){position:relative}
  .nav a:not(:first-child)::before{
    content:""; position:absolute; left:-1px; top:50%; transform:translateY(-50%);
    width:1px; height:18px; background:rgba(0,0,0,.16);
  }
  .nav a:hover::before{opacity:0}
  /* spodní zvýraznění zarovnané s obsahem položky, o něco výraznější */
  .nav a::after{left:12px; right:12px; height:2.5px; bottom:4px}
}
@media (min-width:1025px){
  .header .btn--phone-sm{display:none}  /* telefon je v horní liště – uvolní místo pro 8 položek menu */
}

/* Úkol – horní žlutá lišta: silnější, prémiovější vzhled na PC a větších displejích.
   Vyšší lišta s jemným tmavým spodním lemem a širší vnitřní řádek, aby se větší
   menu pohodlně vešlo i s logo-textem (obsah stránek zůstává v 1200px). */
@media (min-width:1025px){
  .header{box-shadow:0 3px 14px rgba(0,0,0,.12); border-bottom:1px solid rgba(0,0,0,.14)}
  .header__inner{max-width:1360px; min-height:90px; gap:28px}
  .logo img{height:68px}
}

/* Úkol – mobilní rozklikávací menu ve žluté liště: čistší, profesionálnější
   a prémiovější vnitřek. Každá položka je přehledný řádek s ikonou v tmavém
   „chipu", jemným oddělovačem a decentní šipkou cíle. */
@media (max-width:1024px){
  .nav{
    padding:8px 14px 12px;
    gap:0;
    background:linear-gradient(180deg, var(--yellow) 0%, var(--yellow-2) 100%);
    border-top:2px solid #0a0a0a;
    box-shadow:0 22px 38px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.28);
  }
  .nav a{
    display:flex; align-items:center; gap:14px; width:100%;
    padding:13px 6px; border-radius:8px;
    font-size:15px; font-weight:600; letter-spacing:.8px; color:#0a0a0a;
    border-bottom:1px solid rgba(0,0,0,.12);
    transition:background .2s var(--ease), padding-left .2s var(--ease);
  }
  .nav a:last-child{border-bottom:none}
  .nav a:active{background:rgba(0,0,0,.07)}
  .nav a:hover{background:rgba(0,0,0,.05); padding-left:12px}
  /* ikona v kontrastním kruhovém chipu – sjednocuje vzhled a působí prémiově */
  .nav .nav__ico{
    width:38px; height:38px; padding:9px; flex:none; opacity:1;
    border-radius:50%; background:var(--black); color:var(--yellow);
    box-shadow:0 3px 8px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12);
    transition:transform .2s var(--ease);
  }
  .nav a:hover .nav__ico{transform:none}
  /* jemná šipka napravo naznačující přechod na sekci */
  .nav a::after{
    content:""; position:static; flex:none; margin-left:auto;
    width:8px; height:8px; background:none; opacity:1;
    border-right:2px solid rgba(0,0,0,.42); border-bottom:2px solid rgba(0,0,0,.42);
    transform:rotate(-45deg); transform-origin:center;
  }
  .nav a:hover::after{transform:rotate(-45deg); border-color:#0a0a0a}
}

/* ============================================================
   ÚPRAVA 2026 — přestavba na firemní web „Výškové práce Anděl"
   Pouze ADITIVNÍ doplňky pro nové sekce (recenze, pásmo působnosti,
   poznámka k nacenění). Sdílí stávající designové tokeny – beze
   změny existujících pravidel, animací a responzivity.
   ============================================================ */

/* --- Recenze zákazníků (sdílí vizuální jazyk .ref / karet) --- */
.reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px}
.review{display:flex;flex-direction:column;gap:16px;padding:28px 26px;background:rgba(255,255,255,.03);border:1px solid #2a2d31;border-left:3px solid var(--yellow);border-radius:4px;transition:background .25s,border-color .25s}
.review:hover{background:rgba(27,86,136,.06);border-color:var(--yellow)}
.review__quote{color:#dfe3e7;font-size:16px;line-height:1.6}
.review__quote::before{content:"„";color:var(--yellow);font-family:'Anton',sans-serif;font-size:30px;line-height:0;vertical-align:-10px;margin-right:4px}
.review__meta{margin-top:auto;font-family:'Oswald',sans-serif;font-size:12.5px;letter-spacing:1.5px;text-transform:uppercase;color:#9aa0a6}
.review__meta strong{display:block;color:#fff;font-size:15px;letter-spacing:.6px;text-transform:none;margin-bottom:2px}
@media (max-width:1024px){.reviews{grid-template-columns:minmax(0,1fr);max-width:560px;margin-left:auto;margin-right:auto}}

/* --- Pásmo působnosti / poznámka k nacenění --- */
.note{margin-top:28px;padding:18px 22px;background:rgba(27,86,136,.1);border-left:4px solid var(--yellow);font-size:15px;color:#4a4f54;border-radius:2px}
.section--dark .note{background:rgba(27,86,136,.08);color:#c8ccd1}
.areas{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.areas span{font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#1a1a1a;background:rgba(0,0,0,.08);border:1px solid rgba(0,0,0,.18);padding:8px 14px;border-radius:3px}
.section--dark .areas span{color:#e7e7e7;background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18)}

/* =====================================================================
   ===  MODERNIZACE 2026  =============================================
   Zachovává industriální identitu (černá + žlutá). Pouze:
   (1) lehké doladění barev → grafit + sytější zlatá
   (2) přepracovaný FORMÁT a ROZLOŽENÍ boxů a prvků
   Vše jako override existujících tříd – HTML i JS beze změny.
   ===================================================================== */

/* (1) ---- LEHKÉ DOLADĚNÍ PALETY (grafit + zlatá), ostřejší geometrie ---- */
:root{
  --yellow:#1B5688;      /* sytější, o něco teplejší zlatá místo neonové */
  --yellow-2:#134266;
  --black:#0a0c0f;       /* grafitová čerň s chladným nádechem */
  --ink:#0f1216;
  --dark:#13171c;
  --dark-2:#191e25;
  --line:#2b323b;        /* chladnější hairline */
  --muted:#8b929c;
  --radius:2px;          /* ostřejší, techničtější rohy */
  --radius-btn:3px;
}
.hero__ghost{-webkit-text-stroke-color:rgba(27,86,136,.5)}

/* (2) ---- RYTMUS SEKCÍ + NADPISY ---- */
.section{padding:clamp(82px,11vh,128px) 0}
.h2{font-size:clamp(32px,4.6vw,58px);letter-spacing:.3px;line-height:1.0}
.eyebrow{font-size:12px;letter-spacing:3.5px}
.lead{font-size:18px;line-height:1.62}

/* ---- STRIP: segmentovaný pruh ---- */
.strip{padding:0;border-top:none}
.strip__inner{justify-content:stretch;gap:0;padding:0}
.strip__inner span{flex:1;text-align:center;padding:18px 10px;border-left:1px solid var(--line);padding-left:10px}
.strip__inner span:first-child{border-left:none}
.strip__inner span::before{position:static;display:inline-block;margin-right:9px;font-size:9px;vertical-align:2px}
@media (max-width:760px){.strip__inner{flex-wrap:wrap}.strip__inner span{flex:1 1 50%;border-top:1px solid var(--line)}}

/* ---- HERO: segmentované staty ---- */
.hero__usps{gap:0;border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);overflow:hidden}
.hero__usps li{padding:20px 22px;border-left:1px solid rgba(255,255,255,.12)}
.hero__usps li:first-child{border-left:none}
.hero__usps strong{font-size:30px}
@media (max-width:640px){.hero__usps{grid-template-columns:repeat(2,1fr)}.hero__usps li:nth-child(odd){border-left:none}.hero__usps li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12)}}

/* ---- KARTY SLUŽEB: hairline dlaždice + horní akcentní linka ---- */
.cards{gap:18px;margin-top:52px}
.card{background:var(--dark-2);border:1px solid var(--line);border-radius:var(--radius);position:relative}
.card::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--yellow);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);z-index:3}
.card:hover{transform:translateY(-6px);border-color:#3a424c}
.card:hover::after{transform:scaleX(1)}
.card__img{height:208px;border-bottom:1px solid var(--line)}
.card__body{padding:30px 28px;gap:13px}
.card__body h3{font-size:25px;line-height:1.08}
.card__meta{border:none;border-top:1px solid var(--line);padding:12px 0 0;margin-top:2px;color:#9aa0a6}
/* index dlaždice */
.card__body h3::before{content:counter(svc,decimal-leading-zero);counter-increment:svc;display:block;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:2px;color:var(--yellow);margin-bottom:10px}
.cards{counter-reset:svc}
.card--featured{box-shadow:0 24px 60px rgba(27,86,136,.12);border-color:var(--yellow)}
.card__badge{top:0;right:0;border-radius:0 0 0 4px;padding:8px 14px}

/* tři rovnocenné silné boxy na desktopu */
@media (min-width:921px){
  .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.card--featured{grid-row:auto;grid-column:auto}

/* ---- COURSE-REPEAT panel ---- */
.course-repeat{border-radius:var(--radius);border:1px solid var(--line);border-top:3px solid var(--yellow);padding:32px 34px}
/* ---- CALLOUT ---- */
.callout{border-radius:var(--radius);border-left-width:4px}

/* ---- DETAILNÍ VÝČET (kb): bento hairline mřížka ---- */
.kb{gap:1px;background:#e6e6e6;border:1px solid #e6e6e6;border-radius:var(--radius);overflow:hidden;margin-top:48px}
.kb article{background:#fff;border:none;border-radius:0;padding:28px 26px;position:relative;transition:background .25s}
.kb article::before{content:"";position:absolute;left:0;top:0;width:0;height:0;border-style:solid;border-width:14px 14px 0 0;border-color:var(--yellow) transparent transparent transparent;opacity:0;transition:opacity .25s}
.kb article:hover{background:#fafafa}
.kb article:hover::before{opacity:1}
.kb h3{font-size:17.5px}

/* ---- HODNOTY (grid-4 / feat): bento hairline + spodní akcent ---- */
.grid-4{gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:48px}
.feat{background:var(--dark);border:none;border-radius:0;padding:34px 28px;position:relative}
.feat::before{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--yellow);transition:width .35s var(--ease)}
.feat:hover{background:rgba(27,86,136,.05)}
.feat:hover::before{width:100%}
.feat__num{font-size:36px;color:var(--yellow);-webkit-text-stroke:0}

/* ---- REFERENCE & PRO KOHO: editorial index řádky ---- */
.refs{display:block;border-top:1px solid var(--line);margin-top:44px;counter-reset:rl}
.ref{display:grid;grid-template-columns:46px minmax(0,1.3fr) minmax(0,1fr);gap:22px;align-items:center;
  padding:22px 4px;border-bottom:1px solid var(--line);counter-increment:rl;position:relative;transition:padding .3s var(--ease),background .3s var(--ease)}
.ref::before{content:counter(rl,decimal-leading-zero);font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:1.5px;color:var(--muted)}
.ref:hover{padding-left:18px;background:rgba(255,255,255,.02)}
.ref:hover::before{color:var(--yellow)}
.ref__name{font-size:clamp(18px,2vw,25px);letter-spacing:.3px}
.ref__tag{justify-self:end;text-align:right;letter-spacing:1.5px}
@media (max-width:680px){.ref{grid-template-columns:34px 1fr;gap:6px 14px;padding:18px 2px}.ref__tag{grid-column:2;justify-self:start;text-align:left}}

/* ---- RECENZE: ostřejší dlaždice s velkým uvozovákem ---- */
.reviews{gap:18px;margin-top:44px}
.review{background:var(--dark-2);border:1px solid var(--line);border-left:3px solid var(--yellow);border-radius:var(--radius);padding:30px 28px;position:relative}
.review:hover{border-color:#3a424c;border-left-color:var(--yellow);background:rgba(27,86,136,.04)}
.review__quote{font-size:16.5px}

/* ---- STEPS: propojená moderní časová osa ---- */
.steps{gap:14px;margin-top:54px;position:relative}
.steps::before{content:"";position:absolute;top:31px;left:9%;right:9%;height:2px;
  background:repeating-linear-gradient(90deg,var(--yellow) 0 14px,transparent 14px 26px);z-index:0}
.steps li{background:transparent;border:none;border-radius:0;padding:0 12px;text-align:center}
.steps li span{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 18px;
  border:2px solid var(--yellow);border-radius:50%;background:#fff;color:#111;font-size:25px;-webkit-text-stroke:0;position:relative;z-index:1}
.steps li h3{font-size:17px}
@media (max-width:820px){
  .steps{grid-template-columns:1fr;gap:0;max-width:520px;margin-left:auto;margin-right:auto}
  .steps::before{top:0;bottom:0;left:31px;right:auto;width:2px;height:auto;background:repeating-linear-gradient(180deg,var(--yellow) 0 14px,transparent 14px 26px)}
  .steps li{display:grid;grid-template-columns:64px 1fr;gap:18px;text-align:left;padding:14px 0;align-items:start}
  .steps li span{margin:0}
}

/* ---- FAQ: plochý editorial akordeon ---- */
.faq{gap:0;margin-top:44px;border-top:1px solid #e6e6e6}
.faq details{background:transparent;border:none;border-bottom:1px solid #e6e6e6;border-radius:0}
.faq details[open]{background:transparent;box-shadow:none}
.faq summary{padding:24px 4px;font-size:clamp(17px,1.7vw,21px)}
.faq summary::after{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1.5px solid rgba(0,0,0,.25);border-radius:50%;font-size:22px;line-height:1;font-weight:400;text-align:center}
.faq details[open] summary::after{border-color:var(--yellow);background:var(--yellow)}
.faq details p{padding:0 4px 26px;font-size:15.5px;max-width:80ch}

/* ---- KONTAKT: dlaždice s horní akcentní linkou ---- */
.contact{gap:18px;margin-top:44px}
.contact__card{background:var(--dark-2);border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;position:relative;overflow:hidden}
.contact__card::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--yellow);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.contact__card[href]:hover::after{transform:scaleX(1)}
.contact__card[href]:hover{border-color:#3a424c}

/* ---- SPLIT média: tenký rám + rohové „ticky" ---- */
.split__media{border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 30px 70px rgba(0,0,0,.45);position:relative}
.split__media::before,.split__media::after{content:"";position:absolute;width:22px;height:22px;border:3px solid var(--yellow);z-index:2}
.split__media::before{top:-1px;left:-1px;border-right:none;border-bottom:none}
.split__media::after{bottom:-1px;right:-1px;border-left:none;border-top:none}

/* ---- FORMULÁŘ: ostřejší, techničtější ---- */
.form{border-radius:var(--radius);padding:clamp(26px,3vw,40px);border-color:rgba(255,255,255,.12)}
.form input,.form select,.form textarea{border-radius:var(--radius);border:1px solid #2f343b;background:#0e1115;color:#fff}
.form input::placeholder,.form textarea::placeholder{color:#6f757d}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(27,86,136,.18)}
.form select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%231B5688' stroke-width='1.6'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:42px}

/* ---- CENÍK (žlutá sekce): jemné odsazení boxů ---- */
.section--yellow .areas span{border-radius:var(--radius)}
/* Ceník – lepší čitelnost: větší mezery mezi odstavci + zvýraznění klíčových informací */
#cenik p{margin-bottom:22px; line-height:1.8}
#cenik p:last-of-type{margin-bottom:26px}
#cenik p strong{font-weight:700; color:#000}
@media (max-width:600px){ #cenik p{margin-bottom:18px; line-height:1.78} }
/* pomocná třída – skrýt obsah jen na mobilu */
.hide-m{display:inline}
@media (max-width:600px){ .hide-m{display:none} }
/* (úkol) bílý text jen na mobilu – lepší čitelnost vybraných vět */
@media (max-width:600px){ .wht-m, .wht-m strong{color:#fff} }

/* ---- BUTTONY: o stupínek ostřejší ---- */
.btn{border-radius:var(--radius-btn);letter-spacing:1.8px}

/* --- Recenze: bodové hodnocení + zákazníci (úkol reference) --- */
.review{position:relative;padding-right:64px}
.review__score{position:absolute;top:24px;right:22px;font-family:'Oswald',sans-serif;font-weight:700;
  font-size:13px;letter-spacing:.5px;color:var(--black);background:var(--yellow);padding:5px 9px;border-radius:3px;line-height:1}
.review__meta{display:flex;flex-direction:column;gap:2px;font-family:'Oswald',sans-serif;font-size:12.5px;
  letter-spacing:1px;text-transform:uppercase;color:#9aa0a6;margin-top:auto}
.review__meta strong{color:#fff;font-size:15px;letter-spacing:.4px;text-transform:none}
@media (min-width:681px) and (max-width:1024px){.reviews{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}}

.clients{margin-top:44px;border-top:1px solid var(--line);padding-top:28px}
.clients__label{display:block;font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:2.5px;
  text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.cl-short{display:none}
@media (max-width:600px){
  .clients__label{font-size:12px;letter-spacing:1.2px;white-space:normal;line-height:1.4}
  .cl-full{display:none}
  .cl-short{display:inline}
}
.clients__list{display:flex;flex-wrap:wrap;gap:10px}
.clients__list li{font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;letter-spacing:.6px;
  color:#e7e7e7;background:rgba(255,255,255,.04);border:1px solid var(--line);padding:10px 16px;border-radius:var(--radius);
  transition:border-color .25s,background .25s}
.clients__list li:hover{border-color:var(--yellow);background:rgba(27,86,136,.06)}

/* =====================================================================
   ===  ÚPRAVY – pořadí služeb, zelený akcent, prémiové recenze  ======
   ===================================================================== */

/* Jednotný tmavě zelený odstín (zaveden a používán konzistentně:
   spojovací proužek v „Bezpečnost a odbornost" + boxy hodnocení). */
:root{
  --green:#152433;
  --green-2:#1c2c40;
  --green-line:#2e3f55;
}

/* ===================================================================
   PALETA ODVOZENÁ Z NOVÉ HEADER FOTOGRAFIE (věž v Táboře, modré nebe)
   Půlnoční modř oblohy = tmavé plochy + hero. Zlaté hodiny + zlaté logo
   = kultivovaná zlatá jako sjednocující akcent (střídmě, prémiově).
   Reprezentativní výraz: čistá světlá hlavička, restraint, výrazné CTA.
   Pouze hodnoty tokenů – layout, obsah ani struktura se nemění.
   =================================================================== */
:root{
  --black:#0b121e;        /* půlnoční modročerná – obloha z fotky */
  --ink:#0d1422;
  --dark:#111b2b;         /* tmavé sekce */
  --dark-2:#172334;       /* zvýšené plochy / karty */
  --line:#283648;         /* chladná hairline v modré */
  --muted:#8c98aa;
  --yellow:#1B5688;       /* kultivovaná zlatá – akcent (čísla, eyebrow, highlight) */
  --yellow-2:#134266;     /* hlubší zlatá – hover, hloubka */
  --accent-deep:#134266;  /* hluboká břidlicová pro důraz na světlém pozadí + CTA */
  --green:#152433;        /* tmavá navy plocha pro recenze (sjednoceno s webem) */
  --green-2:#1c2c40;
  --green-line:#2e3f55;
  /* světlé chrome plochy (čistá hlavička) */
  --surface:#ffffff;
  --surface-line:#e6e9ef;
}
::selection{background:rgba(27,86,136,.9);color:#0b121e}
::-moz-selection{background:rgba(27,86,136,.9);color:#0b121e}

/* (1) Hlavní služba (.card--featured = 2. v pořadí) vždy vizuálně uprostřed na PC.
   DOM pořadí A,B,C (na mobilu logicky shora dolů). */
@media (min-width:921px){
  .cards .card:nth-child(1){order:1}  /* Rizikové výškové práce → vlevo */
  .cards .card:nth-child(2){order:2}  /* Hlavní služba → uprostřed */
  .cards .card:nth-child(3){order:3}  /* Školení a revize OOPP → vpravo */
}
/* po přeskupení by číslování L→R nedávalo smysl – decentně skryjeme */
.card__body h3::before{content:none}

/* (3) Zelený spojovací proužek přes celou šířku obou sloupců */
.ai-excerpt--full{width:100%;margin-top:34px;border-radius:var(--radius)}
.section--dark .ai-excerpt--full{
  background:var(--green);
  border:1px solid var(--green-line);
  border-left:4px solid var(--yellow);
  color:#d6dee8 !important;
}
.section--dark .ai-excerpt--full strong{color:#fff}

/* (5)+(6) Prémiové, kompaktní a vyrovnané boxy hodnocení na tmavě zeleném pozadí */
.reviews{gap:16px;margin-top:40px}
.review{
  background:var(--green);
  border:1px solid var(--green-line);
  border-left:1px solid var(--green-line);
  border-radius:var(--radius);
  padding:26px 26px;
  display:flex;flex-direction:column;gap:16px;
  justify-content:flex-start;min-height:236px;position:relative;
  transition:background .25s,border-color .25s,transform .25s}
.review:hover{background:var(--green-2);border-color:#36475d;transform:translateY(-4px)}
/* hodnocení = jemný zlatý akcent, ne dominantní plocha */
.review__score{position:static;align-self:flex-start;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:12.5px;letter-spacing:.5px;
  color:var(--yellow);background:transparent;border:1px solid rgba(27,86,136,.45);
  padding:4px 11px;border-radius:999px;line-height:1}
.review__score::before{content:"★ ";color:var(--yellow);font-size:11px}
/* citace – těžiště boxu, čistá typografie i u krátkých textů */
.review__quote{flex:1;display:flex;align-items:center;margin:0;
  color:#e9eff6;font-size:16.5px;line-height:1.5;letter-spacing:.1px}
.review__quote::before{content:"“";font-family:'Anton',sans-serif;color:var(--yellow);
  opacity:.5;font-size:30px;line-height:0;margin-right:8px;align-self:flex-start;transform:translateY(14px)}
/* patička – jméno + typ zakázky, oddělená jemnou linkou */
.review__meta{margin-top:0;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);
  display:flex;flex-direction:column;gap:3px;
  font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#8c98aa}
.review__meta strong{color:#fff;font-size:15px;letter-spacing:.4px;text-transform:none;font-family:'Inter',sans-serif;font-weight:600}
@media (max-width:560px){.review{min-height:0}}

/* =====================================================================
   ===  MOBILNÍ OPTIMALIZACE  =========================================
   ===================================================================== */

/* (A) Konec vodorovného přetékání – skryté dekorace / redundantní navigace */
@media (max-width:600px){
  .hero__ghost{display:none}            /* na mobilu velkou vrstvu nezobrazujeme – tam je výrazný podpis ANDĚL */
}
@media (max-width:680px){
  .dotnav{display:none}                 /* redundantní s hamburger menu + přetékalo off-canvas */
  .footer{padding-bottom:24px}          /* místo pro plovoucí spodní tlačítko – nezakrývá drobný text */
}

/* (B) Tlačítka se na mobilu nesmí ořezávat – text se zalomí, CTA přes celou šířku */
@media (max-width:560px){
  .btn{white-space:normal;text-align:center;line-height:1.25}
  .btn--large{padding:17px 22px;font-size:15px}
  .hero__cta,.cta-row{flex-direction:column;align-items:stretch}
  .hero__cta .btn,.cta-row .btn{width:100%}
}

/* (C) Kratší stránka, čistší svislý rytmus, sjednocené velikosti */
@media (max-width:560px){
  .section{padding:58px 0}
  .container{padding:0 18px}
  .h2{font-size:clamp(26px,7.5vw,34px)}
  .lead{font-size:16.5px}
  .eyebrow{font-size:11.5px;letter-spacing:2.5px}

  .hero{min-height:auto;padding:30px 0 46px}
  .hero h1{font-size:clamp(34px,10vw,46px)}
  .hero__sub{font-size:16px;margin-bottom:26px}
  .hero__usps{margin-top:28px;padding-top:22px;gap:0}
  .hero__usps strong{font-size:24px}
  .hero__refs{margin-top:22px;font-size:12px}

  .cards{margin-top:30px}
  .card__body{padding:24px 22px;gap:11px}
  .card__body h3{font-size:23px}
  .kb,.grid-4,.values,.reviews,.contact,.refs,.steps,.aud,.pricegrid{margin-top:26px}
  .clients{margin-top:30px}
  .feat{padding:26px 22px}
  .review{padding:22px 22px}
  .section__head,.section .lead{margin-bottom:0}
}

/* (D) Pojistka proti přetečení na úzkých displejích */
@media (max-width:768px){
  html,body{overflow-x:hidden}
  .hero__inner,.container{max-width:100%}
}

/* =====================================================================
   ===  SLIDER HODNOCENÍ (jeden prémiový rámeček)  ====================
   ===================================================================== */
.revslider{margin-top:40px;max-width:900px}
@media (min-width:601px){ .revslider{max-width:none} }   /* PC: box hodnocení na celou šířku sekce */
.revslider__viewport{overflow:hidden;border:1px solid var(--green-line);border-left:3px solid var(--yellow);
  background:linear-gradient(180deg,var(--green-2),var(--green));border-radius:var(--radius);
  box-shadow:0 30px 70px rgba(0,0,0,.42)}
.revslider__track{display:flex;will-change:transform;transition:transform .55s var(--ease)}
.revslide{flex:0 0 100%;min-width:0;box-sizing:border-box;padding:46px 52px;
  display:flex;flex-direction:column;gap:22px;min-height:296px}
.revslide__score{align-self:flex-start;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;
  letter-spacing:.6px;color:var(--yellow);border:1px solid rgba(27,86,136,.45);padding:5px 13px;border-radius:999px;line-height:1}
.revslide__quote{flex:1;display:flex;align-items:center;margin:0;color:#e9eff6;
  font-size:clamp(18px,2.1vw,23px);line-height:1.5;letter-spacing:.1px;font-weight:500}
.revslide__quote::before{content:"“";color:var(--yellow);opacity:.45;font-family:'Anton',sans-serif;
  font-size:46px;line-height:0;margin-right:10px;vertical-align:-14px}
.revslide__meta{display:flex;flex-direction:column;gap:3px;margin:0;
  font-family:'Oswald',sans-serif;font-size:12.5px;letter-spacing:1px;text-transform:uppercase;color:#8c98aa}
.revslide__meta strong{color:#fff;font-size:17px;letter-spacing:.3px;text-transform:none;font-family:'Inter',sans-serif;font-weight:600}
.revslider__nav{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:24px}
.revslider__arrow{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:transparent;border:1px solid var(--line);color:#cfd3d8;font-size:22px;line-height:1;cursor:pointer;
  transition:border-color .2s,color .2s,background .2s}
.revslider__arrow:hover{border-color:var(--yellow);color:var(--yellow);background:rgba(27,86,136,.07)}
.revslider__dots{display:flex;gap:9px;align-items:center}
.revslider__dots button{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.22);border:0;padding:0;cursor:pointer;
  transition:width .3s var(--ease),background .3s,border-radius .3s}
.revslider__dots button.is-on{width:26px;border-radius:6px;background:var(--yellow)}
@media (max-width:560px){
  .revslide{padding:30px 24px;min-height:340px;gap:18px}
  .revslide__quote{font-size:18px}
  .revslider__nav{gap:14px}
}

/* =====================================================================
   ===  OPRAVA: tří-tečkové mobilní menu (viditelné + kontrastní)  ====
   ===================================================================== */
@media (max-width:680px){
  .dotnav{display:block}                 /* znovu zapnuté tří-tečkové menu */
  .nav-toggle{display:none}              /* na telefonu používáme tří-tečkové menu (bez duplicity) */
  .dotnav__trigger{
    background:rgba(18,20,24,.34);
    -webkit-backdrop-filter:saturate(150%) blur(11px);backdrop-filter:saturate(150%) blur(11px);
    border:1px solid rgba(255,255,255,.16);border-right:none;
    box-shadow:0 6px 18px rgba(0,0,0,.18);
    width:46px;height:82px;
  }
  /* Nad tmavými sekcemi sklo decentně potemní (ladí + drží kontrast teček) */
  .dotnav.on-dark .dotnav__trigger{background:rgba(10,12,15,.42);border-color:rgba(27,86,136,.30)}
  .dotnav.is-open .dotnav__trigger{background:rgba(10,12,15,.55)}
  /* Tečky: adaptivní kontrast – na světlém pozadí tmavé s jemnou září,
     nad tmavými sekcemi žluté s tmavým lemem; vždy čitelné a decentní. */
  .dotnav__trigger .dotnav__dots i{
    width:6px;height:6px;border-radius:50%;
    background:#0a0a0a;opacity:.6;box-shadow:0 0 0 1.4px rgba(255,255,255,.6);
  }
  .dotnav.on-dark .dotnav__trigger .dotnav__dots i{
    background:var(--yellow);opacity:.95;box-shadow:0 0 0 1.2px rgba(0,0,0,.45);
  }
}

/* =====================================================================
   ===  ÚPRAVY 2026/06  ================================================
   Doladění desktopu + Affekt zakončení. Pouze aditivní override,
   sdílí stávající tokeny (žlutá/grafit), HTML/JS jádro beze změny.
   ===================================================================== */

/* (C) HERO – nová fotka: věž ukotvená vlevo, tmavá obloha za textem.
   Bez zoomu/panu (ten byl laděný na původní snímek horolezce). */
@media (min-width:1025px){
  .hero__bg{transform:none;background-position:0% 28%}
  .hero__overlay{background:linear-gradient(to right,rgba(11,18,30,.14) 0%,rgba(11,18,30,.06) 34%,rgba(11,18,30,.30) 46%,rgba(11,18,30,.62) 60%,rgba(11,18,30,.86) 100%),linear-gradient(180deg,rgba(11,18,30,.12) 0%,rgba(11,18,30,0) 42%,rgba(11,18,30,.3) 100%)}
  .hero__inner{max-width:min(540px,45vw);margin-left:50%;margin-right:auto;padding-left:0;padding-right:clamp(16px,2vw,32px)}
  .hero__usps{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px}
}
@media (min-width:1500px){
  .hero__bg{transform:none;background-position:0% 26%}
  .hero__inner{margin-left:47.5%;max-width:min(580px,42vw)}
}
@media (prefers-reduced-motion:reduce){
  .hero__bg{transition:none}
}

/* (F1) BEZPEČNOST A ODBORNOST – vyrovnání desktopu:
   fotka se na PC roztáhne na výšku obsahu (žádné prázdné místo vedle). */
@media (min-width:821px){
  #bezpecnost .split{align-items:stretch}
  #bezpecnost .split__media{min-height:380px;height:100%}
}

/* (F2) Decentní oddělovač mezi „Bezpečnost a odbornost" a „Proč Výškové práce Anděl"
   (obě sekce mají tmavé pozadí – potřebují vizuální předěl). */
#bezpecnost{padding-bottom:clamp(58px,6.8vh,88px)}
#proc{padding-top:0}
#proc > .container{position:relative;padding-top:clamp(58px,6.8vh,88px)}
#proc > .container::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:clamp(150px,44%,380px);height:1px;background:var(--line)}
/* středový značkový prvek oddělovače – oválná karabina (SVG v HTML, .sec-link) */
.sec-link{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);
  background:var(--dark);padding:0 12px;line-height:0;color:var(--yellow);z-index:1;pointer-events:none}
.sec-link svg{width:42px;height:29px;display:block;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}
.sec-link img{width:54px;height:54px;display:block;object-fit:contain;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.5))}

/* (G) O SPOLEČNOSTI – logo místo velké „portrétové" plochy: zmenšit,
   centrovat a zobrazit celé (contain) na decentním grafitovém poli. */
#o-nas .split__media.instructor-photo{
  aspect-ratio:1/1;min-height:0;max-width:340px;width:100%;
  margin-inline:auto;align-self:center;
  background-size:contain;background-repeat:no-repeat;background-position:center;
  background-color:var(--black);
}
@media (max-width:1024px){
  #o-nas .split__media.instructor-photo{max-width:300px}
}

/* (H) REFERENCE – vycentrovat prémiový rámeček, aby na desktopu
   nepůsobil odsazený doleva (vyvážené, konzistentní zobrazení). */
.revslider{margin-left:auto;margin-right:auto}
.revslide{min-height:300px;justify-content:space-between}

/* (K) VYBRANÍ ZÁKAZNÍCI A REALIZACE – responzivní, vyvážené štítky.
   Štítky rovnoměrně vyplní řádek; osamocený štítek na posledním řádku
   se roztáhne na celou šířku místo malého „zbytku". */
.clients__list{gap:10px}
.clients__list li{flex:1 1 200px;text-align:center;display:flex;align-items:center;justify-content:center}
@media (max-width:520px){
  .clients__list li{flex:1 1 100%}
}

/* (A) AFFEKT – decentní, profesionální zakončení webu (ne „nalepená reklama") */
.affekt{border-top:1px solid var(--line);margin-top:48px}
.affekt__inner{display:flex;align-items:center;justify-content:center;gap:16px;
  padding:26px 0 6px;flex-wrap:wrap}
.affekt__label{font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:2.5px;
  text-transform:uppercase;color:#5d6168}
.affekt__brand{display:inline-flex;align-items:center;gap:9px;
  padding:9px 16px;border:1px solid #23262b;border-radius:4px;
  background:rgba(255,255,255,.02);color:#e7e7e7;text-decoration:none;
  font-family:'Oswald',sans-serif;line-height:1;
  transition:border-color .25s,color .25s,background .25s,transform .25s}
.affekt__brand:hover{border-color:var(--yellow);color:#fff;background:rgba(27,86,136,.06);transform:translateY(-2px)}
.affekt__mark{display:inline-flex;color:var(--yellow);transition:transform .35s var(--ease)}
.affekt__word{font-weight:700;font-size:18px;letter-spacing:3px;text-transform:uppercase}
.affekt__desc{font-size:11px;letter-spacing:1.2px;text-transform:none;color:#7e848c;
  padding-left:11px;margin-left:3px;border-left:1px solid #2b2f35;max-width:230px;line-height:1.35}
.affekt__brand:hover .affekt__desc{color:#aab0b8}
.affekt__brand:hover .affekt__mark{transform:translateY(-1px)}
@media (prefers-reduced-motion:reduce){
  .affekt__brand,.affekt__mark{transition:none}
  .affekt__brand:hover{transform:none}
  .affekt__brand:hover .affekt__mark{transform:none}
}

/* ============================================================
   ===  ÚPRAVY 2026/06 – várka 2  =============================
   ============================================================ */

/* (3) HERO BADGE – badge zůstává čistý; značkový nápis „ANDĚL" je nově
   řešen jako samostatná plovoucí vrstva v hero (.hero__ghost) níže. */
.hero__mark{position:relative}

/* (13) DOTNAV – odstranit rušivý silný žlutý focus ring.
   Tenké ohraničení boxu (1px) i funkce zůstávají; přístupnost zachována
   decentním neutrálním focusem. */
.dotnav__trigger:focus{outline:none}
.dotnav__trigger:focus-visible{outline:1.5px solid rgba(255,255,255,.55);outline-offset:1px}

/* (1) MOBILNÍ HEADER – proporce dvou pruhů + viditelný hamburger v hlavní liště */
@media (max-width:680px){
  /* A) černý utility bar – o něco vyšší a čitelnější */
  .topbar__inner{padding:11px 16px;font-size:12.5px;gap:6px 18px}
  /* B) žlutá hlavní lišta – nižší a kompaktnější (logo zůstává čitelné) */
  .header__inner{min-height:56px;padding:7px 16px;gap:12px}
  .header .logo img{height:44px}
  .logo__text{padding-left:11px}
  .logo__text strong{font-size:14px;letter-spacing:.5px}
  .logo__text span{display:none}            /* podtitulek skryt → kompaktnější lišta */
  /* hamburger zpět do hlavičky – vpravo, dobře klikatelný a čitelný */
  .nav-toggle{display:flex !important;margin-left:auto;padding:9px 6px}
  .nav-toggle span{width:26px;height:3px;background:#000}
}
@media (max-width:380px){
  .header .logo img{height:40px}
  .header .logo__text strong{font-size:12.5px;letter-spacing:.3px}
}

/* =====================================================================
   ===  HERO – plovoucí značková vrstva „ANDĚL"  (várka 3) ============
   Prémiový industriální outline watermark: tři vrstvy (glow → outline →
   světelný sweep), jemné plování, světelný shimmer. Sedí pod hlavním
   obsahem (z-index pod .hero__inner) → „HOROLEZECKOU TECHNIKOU" zůstává
   plně čitelné. Responzivní; respektuje prefers-reduced-motion.
   ===================================================================== */
.hero__ghost{
  left:-3vw; right:auto; top:63%;
  font-family:'Anton',sans-serif;
  font-size:clamp(120px,12vw,210px);
  letter-spacing:8px; line-height:.9; white-space:nowrap;
  color:transparent;
  -webkit-text-stroke:1.6px rgba(255,255,255,.42);
  z-index:1; pointer-events:none; user-select:none;
  transform:translateY(-50%);
  animation:ghostFloat 16s ease-in-out infinite;
  will-change:transform;
}
.hero__ghost::before,
.hero__ghost::after{
  content:attr(data-text);
  position:absolute; left:0; top:0; white-space:nowrap;
  /* font-size / letter-spacing / line-height / font-family se dědí → přesný překryv */
}
/* vrstva 1 – měkký bílý glow (hloubka, napojení na bílý nadpis) */
.hero__ghost::before{
  color:rgba(255,255,255,.26);
  -webkit-text-stroke:0;
  filter:blur(13px);
  z-index:-1;
  animation:ghostGlow 9s ease-in-out infinite;
}
/* vrstva 3 – pomalý světelný přejezd přes outline */
.hero__ghost::after{
  color:transparent;
  -webkit-text-stroke:0;
  background-image:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.8) 50%,transparent 62%);
  -webkit-background-clip:text; background-clip:text;
  background-size:280% 100%; background-repeat:no-repeat;
  background-position:210% 0;
  animation:ghostSheen 9s ease-in-out infinite;
}
@keyframes ghostFloat{
  0%,100%{transform:translateY(-50%)}
  50%{transform:translateY(calc(-50% - 18px))}
}
@keyframes ghostGlow{
  0%,100%{opacity:.5}
  50%{opacity:1}
}
@keyframes ghostSheen{
  0%{background-position:210% 0}
  55%,100%{background-position:-120% 0}
}

/* TABLET – velká vrstva „LUKÁŠ ANDĚL" (menší, aby se vešla) */
@media (min-width:601px) and (max-width:1024px){
  .hero__ghost{left:-3vw; font-size:clamp(72px,10vw,140px); letter-spacing:6px; -webkit-text-stroke-width:1.5px}
}
/* DESKTOP – výraznější a prostorovější */
@media (min-width:1025px){
  .hero__ghost{left:-6vw; font-size:clamp(100px,9.4vw,178px); letter-spacing:9px; -webkit-text-stroke-width:1.7px}
}
/* Navazující „& SPOL." k velké vrstvě „LUKÁŠ ANDĚL" – tablet i desktop.
   Stejný outline styl, velká verzálka, jemně jiný prémiový zlatý odstín. */
.hero__ghost-amp{
  display:none;
  font-family:'Anton',sans-serif; text-transform:uppercase;
  line-height:.9; white-space:nowrap;
  color:transparent;
  -webkit-text-stroke:1.6px rgba(27,86,136,.62);   /* prémiové zlaté, jemně jiný odstín */
  text-shadow:0 0 26px rgba(27,86,136,.20);
  pointer-events:none; user-select:none;
}
/* TABLET – „& spol." citlivě vpravo dole u velké vrstvy (bez přetékání) */
@media (min-width:601px) and (max-width:1024px){
  .hero__ghost-amp{display:block; position:absolute; right:.04em; bottom:-.56em;
    font-size:.5em; letter-spacing:6px; -webkit-text-stroke-width:1.4px}
}
/* DESKTOP – „& SPOL." vedle napravo od „LUKÁŠ ANDĚL" (na stejné lince) */
@media (min-width:1025px){
  .hero__ghost-amp{display:block; position:absolute; left:100%; bottom:.12em; margin-left:.22em;
    font-size:.62em; letter-spacing:8px}
}

/* MOBIL / menší tablet – dekorativní vrstvu „ANDĚL" nezobrazujeme.
   Na úzkém hero by velký watermark zasahoval do nadpisu nebo by při
   zapnutém „omezit pohyb" působil staticky a rušivě. Hero zůstává čisté;
   prémiová plovoucí vrstva je vyhrazena pro desktop. */
@media (max-width:768px){
  .hero__ghost,
  .hero__ghost::before,
  .hero__ghost::after{display:none !important}
}
@media (prefers-reduced-motion:reduce){
  .hero__ghost,.hero__ghost::before,.hero__ghost::after{animation:none}
}

/* =====================================================================
   ===  MOBIL – plovoucí značkový podpis „ANDĚL" u badge  (várka 4) ===
   Ukotvený k pravému dolnímu rohu žlutého badge (do volného místa, kde
   NENÍ hlavní text). Outline s tmavým keylinem (čitelný na žluté i tmavé),
   zlatý glow (hloubka) a pomalý světelný přejezd. Jemné plování.
   Na desktopu se nezobrazuje – tam je velká vrstva .hero__ghost.
   ===================================================================== */
/* =====================================================================
   ===  HERO BRAND SIGNATURE  (várka 6)  ==============================
   Plovoucí značkový podpis ukotvený k pravému dolnímu rohu žlutého badge.
   Responzivně:  mobil = „ANDĚL" · tablet/desktop = „L. ANDĚL".
   Navazující foreground akcent „& spol." (script) tvoří s podpisem
   jeden vrstvený brand-signature celek. Velká vrstva „LUKÁŠ ANDĚL"
   (.hero__ghost) je vyhrazená pro desktop.
   ===================================================================== */
.hero__mark{overflow:visible}
.hero__mark-sig{
  display:none; position:absolute; right:3%; bottom:-.30em;
  font-family:'Anton',sans-serif; line-height:.9; white-space:nowrap;
  color:rgba(255,255,255,.16);
  -webkit-text-stroke:1.5px rgba(255,255,255,.92);
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.55));
  transform:rotate(-3deg);
  pointer-events:none; user-select:none; z-index:3;
  animation:sigReveal 1.1s cubic-bezier(.22,.61,.36,1) both, sigFloat 8.5s ease-in-out 1.1s infinite; will-change:transform,opacity;
}
.hero__mark-sig::before{           /* bílý glow / hloubka */
  content:attr(data-text); position:absolute; left:0; top:0; white-space:nowrap;
  color:rgba(255,255,255,.65); -webkit-text-stroke:0; filter:blur(6px); z-index:-1;
  animation:sigGlow 6.5s ease-in-out infinite;
}
.hero__mark-sig::after{            /* světelný přejezd */
  content:attr(data-text); position:absolute; left:0; top:0; white-space:nowrap;
  color:transparent; -webkit-text-stroke:0;
  background-image:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.85) 50%,transparent 60%);
  -webkit-background-clip:text; background-clip:text;
  background-size:280% 100%; background-repeat:no-repeat; background-position:210% 0;
  animation:sigSheen 7s ease-in-out infinite;
}
/* „& spol." – signaturní akcent (script), navazuje vpravo dole */
.hero__sig-amp{
  position:absolute; right:-.06em; bottom:-.60em;
  font-family:'Caveat',cursive; font-weight:700;
  -webkit-text-stroke:0; color:var(--yellow);
  font-size:.56em; line-height:1; white-space:nowrap;
  transform:rotate(-2deg);
  text-shadow:0 2px 9px rgba(0,0,0,.6), 0 0 16px rgba(27,86,136,.4);
  z-index:4; opacity:0;
  animation:ampIn 1.1s cubic-bezier(.22,.61,.36,1) .8s both, ampFloat 8.5s ease-in-out 2s infinite;
}
/* výběr varianty podle zařízení */
@media (max-width:600px){
  .hero__mark-sig.sig--m{display:block; font-size:clamp(44px,16.5vw,100px); right:max(2%,14px); bottom:-.42em;
    color:#fff;                                       /* plná bílá výplň – navazuje na bílý nadpis VÝŠKOVÉ PRÁCE */
    -webkit-text-stroke:1.3px rgba(10,10,10,.8);      /* decentní jemný obrys */
    text-shadow:0 3px 12px rgba(0,0,0,.6);
    filter:none;
    /* (úkol) animace jen při prvním načtení – nápis jednou vystoupá do nejvyšší
       polohy a tam trvale zůstane (žádné nekonečné plování). */
    animation:sigReveal 1.1s cubic-bezier(.22,.61,.36,1) both,
              sigRiseOnce 1.6s cubic-bezier(.22,.61,.36,1) 1.1s forwards}
  .hero__mark-sig.sig--m::before{display:none}  /* (úkol) bílá záře / glow odebrána – čistší, prémiovější dojem */
  .hero__mark-sig.sig--m::after{display:none}        /* sheen na plné bílé výplni neuplatníme */
  /* (úkol 5) „& spol." – menší, čistší, technický, ve firemní žluté */
  .sig--m .hero__sig-amp{
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    letter-spacing:1.5px; font-size:.3em; color:var(--yellow);
    -webkit-text-stroke:0; text-shadow:0 2px 7px rgba(0,0,0,.5);
    right:.02em; bottom:-.46em; transform:none;
    animation:ampInCalm 1s ease .9s both;
  }

  /* (úkol 1) Klidný statický podpis – bez přejezdu / blikání přes písmena, decentní obrys */
  .sig--m .sig-l{color:#fff; -webkit-text-stroke:1.3px rgba(10,10,10,.8)}
}
@keyframes ampInCalm{from{opacity:0; transform:translateY(7px)} to{opacity:1; transform:none}}
@media (min-width:601px){
  .hero__mark-sig.sig--lg{display:none}   /* na tabletu i PC nahrazeno velkou vrstvou LUKÁŠ ANDĚL */
}
/* Na PC (desktop) malý podpis „L. ANDĚL & spol." nezobrazujeme –
   na desktopu zůstává jen velká vrstva „LUKÁŠ ANDĚL" (.hero__ghost). */
@media (min-width:1025px){
  .hero__mark-sig.sig--lg{display:none}
}
@keyframes sigReveal{
  0%{opacity:0; transform:rotate(-3deg) translateY(14px) scale(.965)}
  60%{opacity:1}
  100%{opacity:1; transform:rotate(-3deg) translateY(0) scale(1)}
}
@keyframes sigFloat{
  0%{transform:rotate(-3deg) translateY(0)}
  28%{transform:rotate(-2.4deg) translateY(-5px)}
  58%{transform:rotate(-3.5deg) translateY(-8px)}
  82%{transform:rotate(-2.8deg) translateY(-3px)}
  100%{transform:rotate(-3deg) translateY(0)}
}
/* (úkol) Jednorázový výstup nápisu do nejvyšší polohy – konečný stav zůstává (forwards) */
@keyframes sigRiseOnce{
  0%{transform:rotate(-3deg) translateY(0)}
  62%{transform:rotate(-3.4deg) translateY(-10px)}
  100%{transform:rotate(-3deg) translateY(-8px)}
}
@keyframes sigGlow{0%,100%{opacity:.4}50%{opacity:.85}}
@keyframes sigSheen{0%{background-position:210% 0}55%,100%{background-position:-120% 0}}
@keyframes ampIn{0%{opacity:0;transform:rotate(-2deg) translate(8px,6px) scale(.9)}100%{opacity:1;transform:rotate(-2deg) translate(0,0) scale(1)}}
@keyframes ampFloat{
  0%{transform:rotate(-2deg) translateY(0)}
  50%{transform:rotate(-1.3deg) translateY(-6px)}
  100%{transform:rotate(-2deg) translateY(0)}
}
@media (prefers-reduced-motion:reduce){
  .hero__mark-sig,.hero__mark-sig::before,.hero__mark-sig::after,.hero__sig-amp{animation:none}
  .hero__mark-sig{opacity:1; transform:rotate(-3deg)}
  .hero__sig-amp{opacity:1}
  .sig--m .sig-l{animation:none; color:#fff}
}

/* (várka 5) Hierarchie hero nadpisu – „Tábor" jemně utlumené, aby oko
   vnímalo značku „Výškové práce Anděl" (bílý nadpis + plovoucí bílé ANDĚL). */
.hero__city{opacity:.6; font-weight:inherit}
@media (min-width:1025px){ .hero__city{opacity:1} }  /* PC výjimka: „TÁBOR" bílé */

/* =====================================================================
   ===  SEKČNÍ NAVIGACE nahoru/dolů (jen PC + tablet)  ================
   Prémiová žlutá tlačítka pro skok na předchozí/další hlavní sekci.
   ===================================================================== */
.secnav{position:fixed; right:18px; top:50%; transform:translateY(-50%);
  z-index:55; display:none; flex-direction:column; gap:12px}
@media (min-width:681px){ .secnav{display:flex} }
.secnav__btn{
  width:50px; height:50px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(12,14,17,.55); backdrop-filter:blur(7px) saturate(140%);
  -webkit-backdrop-filter:blur(7px) saturate(140%);
  color:var(--yellow); border:1.5px solid rgba(27,86,136,.7);
  cursor:pointer; box-shadow:0 8px 22px rgba(0,0,0,.4);
  transition:background .22s var(--ease), color .22s var(--ease),
             transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease)}
.secnav__btn svg{width:22px; height:22px; display:block}
.secnav__btn:hover{background:var(--yellow); color:#0a0a0a; border-color:var(--yellow);
  transform:translateY(-2px); box-shadow:0 12px 28px rgba(27,86,136,.28)}
.secnav__btn:active{transform:translateY(0)}
.secnav__btn:focus-visible{outline:2px solid var(--yellow); outline-offset:3px}
@media (min-width:1025px) and (max-width:1200px){ .secnav{right:12px} }
@media (prefers-reduced-motion:reduce){
  .secnav__btn{transition:none}
  .secnav__btn:hover{transform:none}
}

/* =====================================================================
   ===  VÁRKA 8  (úkoly 8–13)  =======================================
   ===================================================================== */

/* (10) Vybraní zákazníci – právní forma žlutě, prémiově zakomponovaná */
.clients__lf{color:inherit; font-weight:inherit; font-size:inherit; letter-spacing:inherit}

/* (9) Hvězdičky v hodnocení – větší, masivnější, prémiové, tenký černý obrys */
.revslide__score{display:flex; align-items:center; gap:.55em; flex-wrap:wrap; margin-bottom:8px}
.revstars{display:inline-block; font-size:1.95em; line-height:1; letter-spacing:2px;
  color:var(--yellow); -webkit-text-stroke:1.3px #0a0a0a;
  text-shadow:0 2px 6px rgba(0,0,0,.4); -webkit-font-smoothing:antialiased}
.revslide__pct{font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:1px; color:#fff; font-size:1.05em}
@media (max-width:600px){ .revstars{font-size:1.5em; letter-spacing:1px} }

/* (8) CTA „Více informací" – na mobilu/tabletu atraktivnější, na desktopu zpět
   do původního stylu (plynule animovaný přechod). */
.btn--skoleni{transition:background .45s var(--ease), background-position .45s var(--ease),
  box-shadow .45s var(--ease), transform .25s var(--ease), color .35s var(--ease)}
@media (max-width:1024px){
  .btn--skoleni{
    background-image:linear-gradient(120deg,#1B5688 0%,#c6dadb 50%,#1B5688 100%);
    background-size:220% 100%;
    box-shadow:0 10px 24px rgba(27,86,136,.3), 0 2px 8px rgba(0,0,0,.35);
    animation:skoleniShine 4.6s ease-in-out infinite;
  }
}
@keyframes skoleniShine{0%,100%{background-position:0 0}50%{background-position:100% 0}}

/* (úkol 1) Mobil – tlačítko „Více informací" sjednoceno s ostatními tlačítky u boxů
   (plochá značková žlutá, stejný stín, bez třpytivého gradientu a animace). */
@media (max-width:600px){
  .btn--skoleni{background-image:none; background-color:var(--yellow);
    box-shadow:0 4px 14px rgba(27,86,136,.3),0 1px 3px rgba(0,0,0,.18);
    animation:none}
}

/* (úkol 4) Mobil – „VÝŠKOVÉ PRÁCE" nepatrně větší a v čisté signální bílé,
   aby vedlo pozornost a vizuálně navazovalo na plovoucí bílý nápis ANDĚL.
   „TÁBOR" (.hero__city) ponecháno beze změny. Desktop neovlivněno. */
@media (max-width:600px){
  .hero__lead{font-size:1.06em; color:#fff}
}

/* (11) Mobil – jemný žlutý rámeček kolem fotek ve slideru boxu „Rizikové výškové práce" */
@media (max-width:680px){
  .cards .card:first-child .vps-slider{
    box-shadow:inset 0 0 0 2px rgba(27,86,136,.5), 0 8px 20px rgba(0,0,0,.3);
    border-radius:5px;
  }
}

/* (12) O společnosti – neviditelný rotator dvou obrázků: prémiové prolnutí + jemný zoom */
.onas-rot{position:relative; overflow:hidden; border-radius:8px}
.onas-rot__img{position:absolute; inset:0; background-size:contain; background-repeat:no-repeat;
  background-position:center; background-color:var(--black);
  opacity:0; transform:scale(1.05);
  transition:opacity 1.25s var(--ease), transform 7s linear; will-change:opacity,transform}
.onas-rot__img--a{opacity:1; transform:scale(1)}
.onas-rot.is-b .onas-rot__img--a{opacity:0; transform:scale(1.05)}
.onas-rot.is-b .onas-rot__img--b{opacity:1; transform:scale(1)}

/* (13) O společnosti – rohové grafiky kolem střídajících se obrázků odebrány */
#o-nas .instructor-photo::before,
#o-nas .instructor-photo::after{display:none !important}
@media (prefers-reduced-motion:reduce){
  .btn--skoleni{animation:none}
  .onas-rot__img{transition:opacity .6s var(--ease); transform:none !important}
}

/* ============================================================
   (úkol) Mobilní vylepšení – galerie boxů + reference zákazníků
   ============================================================ */

/* Úkol 2 – galerie hlavních boxů: na mobilu/jednosloupcovém zobrazení
   nahrazujeme pevnou výšku poměrem 4:3 (= poměr zdrojových fotografií),
   takže se na širších mobilech neořezávají hlavy a postavy. Desktop (3 sloupce) beze změny. */
@media (max-width:920px){
  .card__img{height:auto; aspect-ratio:4/3}
}

/* Úkol – „Vybraní zákazníci a realizace".
   DESKTOP (>=601px): plnohodnotné referenční karty s detailem (2 sloupce). */
.client > summary{list-style:none; outline:none}
.client > summary::-webkit-details-marker{display:none}
.cn-d{display:none}   /* varianty názvu reference: .cn-d = desktop, .cn-m = mobil */
@media (min-width:601px){
  .clients{margin-top:34px}
  .clients__label{display:flex; align-items:center; gap:12px; font-size:13px; letter-spacing:2.4px; color:#cfd4da; margin-bottom:22px}
  .clients__label::before{content:""; width:28px; height:2px; background:var(--yellow); flex:none}
  .clients__list{display:grid; grid-template-columns:repeat(2,1fr); gap:18px; align-items:start; counter-reset:cl}
  .client{
    position:relative; counter-increment:cl;
    background:linear-gradient(158deg, rgba(255,255,255,.058), rgba(255,255,255,.018));
    border:1px solid rgba(255,255,255,.09);
    border-left:3px solid var(--yellow);
    border-radius:12px; overflow:hidden; padding:22px 24px;
    transition:transform .28s var(--ease), border-color .28s var(--ease), box-shadow .28s var(--ease), background .28s var(--ease);
  }
  .client::before{
    content:counter(cl,decimal-leading-zero);
    position:absolute; top:14px; right:20px; pointer-events:none;
    font-family:'Anton',sans-serif; font-size:34px; line-height:1; letter-spacing:1px;
    color:rgba(27,86,136,.14);
  }
  .client:hover{
    transform:translateY(-4px); border-color:rgba(27,86,136,.5);
    box-shadow:0 18px 42px rgba(0,0,0,.42);
    background:linear-gradient(158deg, rgba(27,86,136,.07), rgba(255,255,255,.018));
  }
  .client > summary{
    display:block; cursor:default; position:relative;
    padding:0 58px 13px 0; margin-bottom:13px;
    border-bottom:1px solid rgba(255,255,255,.08);
    font-family:'Oswald',sans-serif; font-weight:600; font-size:18px; letter-spacing:.4px;
    color:#fff; text-align:left; line-height:1.25;
  }
  .client > summary::after{display:none}
  .client__detail{display:block; padding:0}
  .client__detail p{margin:0; color:#d6dbe1; font-size:14px; line-height:1.65}
  .client__detail p.client__spec{
    margin-top:15px; padding-top:14px; border-top:1px solid rgba(255,255,255,.08);
    color:#a8b1bd; font-size:13px; line-height:1.6;
  }
  .client__spec::before{
    content:"Specifika a bezpečnost"; display:table;
    font-family:'Oswald',sans-serif; font-weight:600; font-size:10px; letter-spacing:1.4px; text-transform:uppercase;
    color:#0a0a0a; background:var(--yellow); padding:3px 9px; border-radius:4px;
    margin-bottom:10px;
  }
  .cn-m{display:none}
  .cn-d{display:inline}
}

/* MOBIL (<=600px): prémiové rozklikávací boxy s detailem zakázky */
@media (max-width:600px){
  .clients__list{display:block; gap:0; counter-reset:cl}
  .client{
    counter-increment:cl;
    position:relative;
    background:linear-gradient(160deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
    border:1px solid rgba(255,255,255,.085);
    border-left:3px solid var(--yellow);
    border-radius:var(--radius);
    margin-bottom:12px; overflow:hidden;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045), 0 6px 16px rgba(0,0,0,.22);
    transition:border-color .25s, background .25s, box-shadow .25s, transform .2s var(--ease);
  }
  .client[open]{
    background:linear-gradient(160deg, rgba(27,86,136,.075), rgba(255,255,255,.02));
    border-left-color:var(--yellow);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 14px 30px rgba(0,0,0,.36);
  }
  .client > summary{
    display:flex; align-items:center; justify-content:flex-start; gap:0;
    padding:16px 16px; cursor:pointer;
    font-family:'Oswald',sans-serif; font-weight:600; font-size:15.5px; letter-spacing:.4px;
    color:#e9eff6; text-align:left; line-height:1.28;
  }
  /* Industriální pořadové číslo reference + jemný oddělovač – působí jako datasheet, ne jako prostý seznam */
  .client > summary::before{
    content:counter(cl,decimal-leading-zero);
    flex:none; align-self:center;
    font-family:'Anton',sans-serif; font-weight:400; font-size:15px; line-height:1; letter-spacing:.5px;
    color:rgba(27,86,136,.62);
    margin-right:12px; padding-right:12px;
    border-right:1px solid rgba(255,255,255,.12);
  }
  .client[open] > summary::before{color:var(--yellow)}
  .client > summary .clients__lf{margin-left:.34em; color:#c9ccd1; font-weight:600}   /* právní označení hned vedle názvu */
  .client > summary::after{margin-left:auto}          /* ovládací +/− vždy u pravého okraje */
  .client > summary:hover{color:#fff}
  .client > summary::after{
    content:""; flex-shrink:0; width:26px; height:26px; border-radius:50%;
    border:1.5px solid rgba(255,255,255,.28);
    background-color:rgba(255,255,255,.04);
    background-image:
      linear-gradient(rgba(255,255,255,.82),rgba(255,255,255,.82)),
      linear-gradient(rgba(255,255,255,.82),rgba(255,255,255,.82));
    background-size:11px 1.6px, 1.6px 11px;
    background-position:center, center;
    background-repeat:no-repeat;
    transition:transform .3s var(--ease), border-color .25s, background-color .25s, opacity .25s;
  }
  .client[open] > summary::after{
    transform:rotate(135deg);
    border-color:var(--yellow);
    background-color:rgba(27,86,136,.14);
    background-image:
      linear-gradient(#1B5688,#1B5688),
      linear-gradient(#1B5688,#1B5688);
  }
  .client__detail{padding:2px 17px 16px; overflow:hidden}
  .client__detail p{margin:0; color:#d2d7dd; font-size:14px; line-height:1.62}
  .client__detail p.client__spec{
    margin-top:13px; padding-top:13px;
    border-top:1px solid var(--line);
    color:#a8b1bd; font-size:13px;
  }
  .client__spec::before{
    content:"Specifika a bezpečnost"; display:block;
    font-family:'Oswald',sans-serif; font-weight:600; font-size:10px; letter-spacing:2px; text-transform:uppercase;
    color:var(--yellow); margin-bottom:6px; opacity:.9;
  }
}

/* ===== Úkol – Poptávej.cz zvýrazněný odkaz pod textem hodnocení ===== */
/* Nenápadné inline odkazy v textu hodnocení (bez tučného zvýraznění) */
.poptavej-inline,
.ext-records{
  color:#fff; font-weight:inherit; text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.34);
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.poptavej-inline:hover,
.ext-records:hover{color:var(--yellow); border-bottom-color:rgba(27,86,136,.6)}

/* ===== Úkol 5 – „Zobrazit více realizací": skryté boxy + prémiové tlačítko ===== */
.client--extra{display:none}
.clients.is-expanded .client--extra{display:block; animation:clientReveal .5s var(--ease) both}
@keyframes clientReveal{
  from{opacity:0; transform:translateY(14px)}
  to{opacity:1; transform:translateY(0)}
}
@media (prefers-reduced-motion:reduce){
  .clients.is-expanded .client--extra{animation:none}
}

/* MOBIL – reference 9–15 mají jemně odlišný prémiový vizuál, aby po rozkliknutí
   seznam opticky neztěžkl a působil jako kurátorovaný „prémiový" výběr. */
@media (max-width:600px){
  .client--extra{
    border:1px solid rgba(27,86,136,.2);
    border-left:3px solid transparent;
    background:
      linear-gradient(180deg, var(--yellow) 0%, var(--yellow-2) 100%) left/3px 100% no-repeat,
      linear-gradient(160deg, rgba(27,86,136,.07), rgba(255,255,255,.012));
    box-shadow:inset 0 1px 0 rgba(27,86,136,.15), 0 6px 16px rgba(0,0,0,.24);
  }
  .client--extra[open]{
    background:
      linear-gradient(180deg, var(--yellow) 0%, var(--yellow-2) 100%) left/3px 100% no-repeat,
      linear-gradient(160deg, rgba(27,86,136,.11), rgba(255,255,255,.02));
    box-shadow:inset 0 1px 0 rgba(27,86,136,.2), 0 14px 30px rgba(0,0,0,.38);
  }
  /* Číslování 01–15 je vizuálně jednotné – boxy 9–15 používají stejný styl čísla
     jako 1–8 (zlatý text s oddělovačem), liší se jen jemným pozadím a lištou. */
  .client--extra > summary::after{border-color:rgba(27,86,136,.4)}
}

.clients__more{display:flex; justify-content:center; margin-top:26px}
.btn-more{
  position:relative; isolation:isolate; overflow:hidden;
  display:inline-flex; align-items:center; gap:12px;
  padding:15px 30px; cursor:pointer;
  font-family:'Oswald',sans-serif; font-weight:600; font-size:15px; letter-spacing:1.6px; text-transform:uppercase;
  color:#fff; background:linear-gradient(150deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  border:1px solid rgba(27,86,136,.32); border-radius:var(--radius-btn);
  box-shadow:0 8px 26px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .28s var(--ease), border-color .28s var(--ease), box-shadow .28s var(--ease), color .25s var(--ease);
}
.btn-more::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(var(--yellow), var(--yellow-2));
}
.btn-more__glow{
  position:absolute; inset:-40% -10%; z-index:-1; pointer-events:none;
  background:radial-gradient(120px 60px at 50% 120%, rgba(27,86,136,.4), transparent 70%);
  opacity:0; transition:opacity .35s var(--ease);
}
.btn-more:hover{
  transform:translateY(-2px); border-color:rgba(27,86,136,.7); color:#fff;
  box-shadow:0 16px 38px rgba(0,0,0,.46), 0 0 0 1px rgba(27,86,136,.18), inset 0 1px 0 rgba(255,255,255,.08);
}
.btn-more:hover .btn-more__glow{opacity:1}
.btn-more:active{transform:translateY(0) scale(.99)}
.btn-more__chev{width:18px; height:18px; flex:none; transition:transform .35s var(--ease)}
.btn-more[aria-expanded="true"] .btn-more__chev{transform:rotate(180deg)}
.btn-more[aria-expanded="true"]{border-color:rgba(27,86,136,.55)}
@media (max-width:600px){
  .btn-more{width:100%; justify-content:center; padding:15px 22px; font-size:13.5px; letter-spacing:1.3px}
  .clients__more{margin-top:18px}
}

/* DESKTOP – nové rozbalené boxy mají odlišnou, prémiovou grafiku ladící s okolím */
@media (min-width:601px){
  .client--extra{
    background:linear-gradient(158deg, rgba(27,86,136,.07), rgba(255,255,255,.012));
    border-color:rgba(27,86,136,.22);
    border-left:3px solid transparent;
    border-image:linear-gradient(180deg, var(--yellow), var(--yellow-2)) 1;
  }
  .client--extra::before{color:rgba(27,86,136,.2)}   /* zvýrazněné pořadové číslo */
  .client--extra:hover{
    border-color:rgba(27,86,136,.6);
    box-shadow:0 18px 44px rgba(0,0,0,.46), 0 0 0 1px rgba(27,86,136,.12);
    background:linear-gradient(158deg, rgba(27,86,136,.11), rgba(255,255,255,.016));
  }

  /* „Skrýt / Zobrazit více realizací" – na PC ve sbaleném stavu přes celou šířku,
     v rozbaleném prémiově vyplní volnou buňku vedle boxu 15. */
  .clients__list .clients__more{grid-column:1 / -1; margin-top:14px}
  .clients.is-expanded .clients__list .clients__more{
    grid-column:auto; align-self:stretch; margin-top:0;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more{
    width:100%; height:100%; min-height:170px;
    flex-direction:column-reverse; justify-content:center; gap:18px;
    padding:30px 26px; border-radius:12px;
    font-size:15px; letter-spacing:1.8px;
    border:1px solid rgba(27,86,136,.34);
    background:linear-gradient(158deg, rgba(27,86,136,.085), rgba(255,255,255,.014));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 16px 38px rgba(0,0,0,.42);
  }
  .clients.is-expanded .clients__list .clients__more .btn-more::before{display:none}
  .clients.is-expanded .clients__list .clients__more .btn-more__chev{
    width:52px; height:52px; padding:14px; border-radius:50%;
    border:1.5px solid rgba(27,86,136,.55);
    background:rgba(27,86,136,.1); color:var(--yellow);
    transition:transform .35s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
  }
  .clients.is-expanded .clients__list .clients__more .btn-more__label{font-size:15px; color:#fff}
  .clients.is-expanded .clients__list .clients__more .btn-more__glow{
    background:radial-gradient(160px 90px at 50% 110%, rgba(27,86,136,.4), transparent 70%);
  }
  .clients.is-expanded .clients__list .clients__more .btn-more:hover{
    transform:translateY(-3px); border-color:rgba(27,86,136,.7);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 24px 50px rgba(0,0,0,.5), 0 0 0 1px rgba(27,86,136,.16);
  }
  .clients.is-expanded .clients__list .clients__more .btn-more:hover .btn-more__chev{
    background:rgba(27,86,136,.2); border-color:var(--yellow); transform:translateY(-2px) rotate(180deg);
  }
}

/* (úkol) Prémiový proklik na sekci „Vybraní zákazníci a realizace" */
.ref-jump{
  display:inline-flex; align-items:center; gap:13px;
  max-width:100%; margin:22px 0 2px; padding:13px 20px;
  border:1px solid var(--line); border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  text-decoration:none;
  transition:border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.ref-jump:hover, .ref-jump:focus-visible{
  border-color:var(--yellow); transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(0,0,0,.32);
  background:linear-gradient(180deg, rgba(27,86,136,.07), rgba(255,255,255,.015));
}
.ref-jump__label{font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:.4px; color:#fff; font-size:15px}
.ref-jump__hint{color:#9aa0a6; font-size:12.5px}
.ref-jump__hint::before{content:"·"; margin-right:9px; color:var(--yellow)}
.ref-jump__chev{width:22px; height:22px; flex-shrink:0; margin-left:6px; color:var(--yellow); animation:refChev 1.8s ease-in-out infinite}
@keyframes refChev{0%,100%{transform:translateY(0)} 50%{transform:translateY(4px)}}
@media (max-width:600px){
  .ref-jump{display:flex; gap:9px; padding:13px 16px}
  .ref-jump__label{font-size:14.5px}
  .ref-jump__hint{margin-left:0}
  .ref-jump__chev{margin-left:auto}
}
@media (prefers-reduced-motion:reduce){ .ref-jump__chev{animation:none} }

/* Úkol – ref-jump v hero: zobrazen na všech zařízeních, grafika přizpůsobená.
   PC/tablet: kompaktní inline odkaz; mobil: prémiový tmavý panel pod „Vybrané reference". */
@media (min-width:601px){
  .ref-jump--hero{
    display:inline-flex; margin:20px 0 2px; padding:13px 24px;
    background:rgba(10,10,10,.30);
    -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
    border:1px solid rgba(255,255,255,.14); border-left:3px solid var(--yellow);
  }
  .ref-jump--hero:hover, .ref-jump--hero:focus-visible{
    background:rgba(10,10,10,.42); border-color:var(--yellow); transform:translateY(-2px);
    box-shadow:0 14px 30px rgba(0,0,0,.30);
  }
}
@media (max-width:600px){
  .ref-jump--hero{
    width:100%; margin:20px 0 6px; padding:15px 17px; gap:11px;
    background:rgba(10,10,10,.44);
    -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
    border:1px solid rgba(255,255,255,.16);
    border-left:3px solid var(--yellow);
    border-radius:12px;
  }
  .ref-jump--hero:hover, .ref-jump--hero:focus-visible{
    background:rgba(10,10,10,.54);
    border-color:var(--yellow);
  }
  .ref-jump--hero .ref-jump__label{font-size:15px}
  .ref-jump--hero .ref-jump__chev{margin-left:auto}
}


/* ===================================================================
   REPREZENTATIVNÍ DOLADĚNÍ 2026/06 — čistá hlavička + výrazné CTA
   Cíl: profesionální, důvěryhodný výraz (vzor: čisté městské weby).
   Pouze barevné/efektové override, žádná změna layoutu ani obsahu.
   =================================================================== */

/* ---- Horní utility lišta: tmavá, zlaté telefonní číslo ---- */
.topbar{background:var(--black);border-bottom:1px solid var(--line)}
.topbar__phone strong{color:var(--yellow)}

/* ---- Čistá světlá hlavička místo barevné lišty (oficiální, prémiový dojem) ---- */
.header{background:var(--surface);box-shadow:0 1px 0 var(--surface-line),0 10px 28px rgba(11,18,30,.07)}
.header .nav a{color:#13202e}
.header .nav a:hover{color:var(--accent-deep)}
.header .nav a::after{background:var(--yellow);height:2px}
.header .nav-toggle span{background:#13202e}
.header .logo__text strong{color:#13202e}
.header .logo__text span{color:rgba(19,32,46,.62)}
/* tmavý telefon pill v hlavičce zůstává čitelný a značkový */
.header .btn--phone-sm{background:var(--black);color:var(--yellow);border-color:var(--black)}

/* ---- Mobilní rozbalovací menu sladěné s čistou hlavičkou ---- */
@media (max-width:1024px){
  .header .nav{background:var(--surface);border-top:1px solid var(--surface-line);box-shadow:0 18px 34px rgba(11,18,30,.14)}
  .header .nav a{color:#13202e}
}

/* ---- Výrazné primární CTA: sytá zlatá s hloubkou a září, tmavý text ---- */
.btn--primary,
.btn--call,
.btn--yellow,
.hero__cta .btn--primary,
.hero__cta .btn--call{
  background:linear-gradient(180deg,#22669C 0%,#15426A 100%);
  color:#fff;
  box-shadow:0 6px 18px rgba(27,86,136,.36),0 2px 6px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.14);
}
.btn--primary:hover,
.btn--call:hover,
.btn--yellow:hover,
.hero__cta .btn--primary:hover,
.hero__cta .btn--call:hover{
  background:linear-gradient(180deg,#1F6098 0%,#0F3A5C 100%);
  box-shadow:0 14px 30px rgba(27,86,136,.5),0 4px 10px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.16);
}
/* primární „Zavolat" o stupeň výraznější (mírně větší plocha) */
.hero__cta .btn--call{padding:18px 38px;font-size:17px;letter-spacing:1.6px}

/* ---- Headline blok v hero: světlá chladná patina s tmavým textem (light + profi) ---- */
.hero__mark{background:var(--yellow);color:#0b121e}

/* ---- Akcent na SVĚTLÝCH sekcích = bronz kvůli čitelnosti na bílé ---- */
.section:not(.section--dark):not(.section--cta):not(.section--yellow) .eyebrow--yellow{color:var(--accent-deep)}
.section:not(.section--dark):not(.section--cta):not(.section--yellow) .eyebrow--yellow::before{background:var(--accent-deep)}
.faq details:hover{border-left-color:var(--accent-deep)}

/* ===================================================================
   DOLADĚNÍ 2026/06 (B): sekce naceňování + sekce „Vybraní zákazníci"
   =================================================================== */

/* (4) Sekce naceňování: jemné světlé pozadí místo syté plochy (důvěryhodnější) */
.section--yellow{background:#edf5f5;color:#0e1620}
.section--yellow .note{background:#ffffff;border:1px solid #dbe2ea}
.section--yellow .areas span{background:#ffffff;border:1px solid #d3dce6;color:#324050}

/* (1) Sekce „Vybraní zákazníci a realizace“ – prémiovější panely + výraznější text */
.clients{border-top-color:rgba(255,255,255,.14)}
.clients__label{color:#dbe2ea}
@media (min-width:601px){
  .client{
    background:linear-gradient(158deg,#1c2840,#141f31);
    border:1px solid rgba(255,255,255,.12);
    border-left:3px solid var(--yellow);
    box-shadow:0 10px 26px rgba(0,0,0,.3);
  }
  .client::before{color:rgba(27,86,136,.22)}
  .client:hover{
    transform:translateY(-4px);
    border-color:rgba(27,86,136,.6);
    box-shadow:0 22px 48px rgba(0,0,0,.5);
    background:linear-gradient(158deg,#21304c,#16223a);
  }
  .client > summary{font-size:20px;font-weight:700;color:#fff;letter-spacing:.5px;border-bottom-color:rgba(255,255,255,.12)}
  .client__detail p{color:#e4ebf3;font-size:14.5px}
  .client__detail p.client__spec{color:#bac6d3;border-top-color:rgba(255,255,255,.12)}
}
@media (max-width:600px){
  .client{
    background:linear-gradient(160deg,#1c2840,#141f31);
    border:1px solid rgba(255,255,255,.12);
    border-left:3px solid var(--yellow);
  }
  .client[open]{background:linear-gradient(160deg,#21304c,#16223a)}
  .client > summary{font-size:16.5px;color:#f2f6fb}
  .client__detail p{color:#e4ebf3}
  .client__detail p.client__spec{color:#bac6d3}
}

/* (3) PC i mobil: skrýt plovoucí vrstvu „LUKÁŠ ANDĚL & SPOL" v hero (čistší dojem) */
.hero__ghost,
.hero__ghost::before,
.hero__ghost::after{display:none !important}

/* ===================================================================
   MOBIL: hero – do záběru věž v Táboře (prémiový, lokální signál) + čitelnost
   =================================================================== */
@media (max-width:680px){
  .hero__bg{background-position:15% 42%}
  .hero__overlay{background:linear-gradient(180deg,rgba(11,18,30,.66) 0%,rgba(11,18,30,.5) 46%,rgba(11,18,30,.78) 100%)}
  .hero h1{text-shadow:0 3px 22px rgba(0,0,0,.7)}
  .hero__sub{text-shadow:0 2px 14px rgba(0,0,0,.6)}
}

/* ===================================================================
   (2) Zarovnání hlavních odstavců do bloku (justify) + měkké dělení slov
   =================================================================== */
.hero__sub,
#sluzby .lead,
.card__body > p:not(.card__meta),
#bezpecnost .lead,
#o-nas .split__content > p,
#reference .lead,
#cenik p{
  text-align:justify;
  text-justify:inter-word;
  -webkit-hyphens:auto;
  hyphens:auto;
}

/* ===================================================================
   BAREVNÝ SYSTÉM 2026/06: navy + prémiový tyrkys + bezpečnostní zelená
   – zelené „fajfky" v bezpečnostním checklistu (sémantika = bezpečí)
   =================================================================== */
.checklist li::before{background:#34B27A}

/* ===================================================================
   Lišta blogu → výzva na oficiální web (zobrazí se jednou, nahoře)
   =================================================================== */
.blognote{background:linear-gradient(90deg,#0c1a2b,#0e2436);border-bottom:1px solid var(--line);color:#cdd5df;font-size:12.5px}
.blognote__inner{display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 24px;flex-wrap:wrap;text-align:center}
.blognote__txt{letter-spacing:.3px}
.blognote__txt strong{color:#eaf0f6;font-weight:600}
.blognote__link{color:var(--yellow);font-weight:700;letter-spacing:.3px;white-space:nowrap;transition:color .15s ease}
.blognote__link:hover{color:#46c2cb;text-decoration:underline}
@media (max-width:560px){.blognote__inner{font-size:11.5px;padding:6px 14px;gap:4px}}

/* =====================================================================
   SVĚTLÝ MOTIV „TÁBOR" v2 — čisté bílé karty, jemné šedé pásy, městská červená
   ===================================================================== */
:root{
  --black:#23262b; --dark:#f3f4f5; --dark-2:#ffffff; --line:#e3e5e8;
  --muted:#767b82;
  --green:#f6f7f8; --green-2:#eef0f2; --green-line:#e3e5e8;
  --surface:#ffffff; --surface-line:#e6e8ec;
  --yellow:#1B5688; --yellow-2:#134266; --accent-deep:#134266;
}
body{background:#ffffff;color:#23262b}

/* ---- SEKCE: rytmus bílá / jemná šedá ---- */
.section--dark{background:#ffffff;color:#2a2e34}
#vykon,#proc,#reference,#faq{background:#f4f5f6}
#sluzby,#bezpecnost,#prubeh,#pro-koho,#o-nas,#kontakt,.section--yellow{background:#ffffff}
.section--yellow{color:#23262b}

/* ---- TYPOGRAFIE v bývalých tmavých sekcích -> tmavá ---- */
.section--dark h2,.section--dark .h2,.section--dark h3,.section--dark .h2--band,
.section--dark .split__content .h2{color:#16202E}
.section--dark p,.section--dark li,.section--dark .lead{color:#464b52}
.lead{color:#464b52}
.eyebrow{color:#195080}

/* ---- KARTY (služby) -> bílé s červeným akcentem ---- */
.card{background:#ffffff !important;border:1px solid #e4e6e9 !important;box-shadow:0 6px 22px rgba(20,22,26,.05)}
.card:hover{border-color:var(--yellow) !important;box-shadow:0 16px 40px rgba(20,22,26,.12)}
.card__body h3{color:#16202E}
.card__meta{color:#7a7f86 !important;border-top-color:#e7e8eb !important;border-bottom-color:#e7e8eb !important}
.card p{color:#4b5057 !important}
.card__prereq,.card__prereq--base{background:rgba(27,86,136,.07);color:#134266}

/* ---- VÝHODY (#proc) -> bílé dlaždice, červené číslo ---- */
.feat{background:#ffffff !important;border:1px solid #e4e6e9 !important;box-shadow:0 5px 18px rgba(20,22,26,.05)}
.feat:hover{background:#ffffff !important;border-color:var(--yellow) !important;box-shadow:0 14px 34px rgba(20,22,26,.12)}
.feat__num{color:var(--yellow);-webkit-text-stroke:0}
.feat h3{color:#16202E}
.feat p{color:#4b5057}

/* ---- RECENZE -> bílé karty ---- */
.review{background:#ffffff !important;border:1px solid #e4e6e9 !important;border-left:3px solid var(--yellow) !important}
.review__quote{color:#33373d}
.review__meta{color:#7a7f86}
.review__meta strong{color:#16202E}

/* ---- KLIENTSKÉ KARTY -> bílé s červeným akcentem ---- */
#reference{background:#f4f5f6}
.clients__label{color:#5a6068}
.client{background:#ffffff !important;border:1px solid #e4e6e9 !important;border-left:3px solid var(--yellow) !important;box-shadow:0 6px 20px rgba(20,22,26,.05)}
.client::before,.client--extra::before{color:rgba(27,86,136,.13) !important}
.client:hover{background:#ffffff !important;border-color:var(--yellow) !important;box-shadow:0 16px 40px rgba(20,22,26,.12) !important}
.client > summary{color:#16202E !important;border-bottom-color:#e7e8eb !important}
.client > summary .clients__lf{color:#7a7f86 !important}
.client[open] > summary::before,.client > summary:hover{color:#134266 !important}
.client__detail p{color:#4b5057 !important}
.client__detail p.client__spec{color:#7a7f86 !important;border-top-color:#e7e8eb !important}
.client--extra > summary::after{border-color:rgba(27,86,136,.4)}

/* ---- KONTAKTNÍ KARTY -> bílé ---- */
.contact__card{background:#ffffff !important;border:1px solid #e4e6e9 !important;box-shadow:0 6px 20px rgba(20,22,26,.05)}
.contact__card[href]:hover{border-color:var(--yellow) !important}
.contact__label{color:#7a7f86}
.contact__value{color:#16202E}
.contact__cta{color:var(--yellow)}

/* ---- TERMÍN -> tmavě uhlová karta (kontrastní akcent) ---- */
.termin{background:#23262b;color:#e7e9ec;border-left-color:var(--yellow)}
.termin h3{color:#73B4E6}
.termin p{color:#d7dadd}

/* ---- BIZINFO -> bílá karta ---- */
.bizinfo{background:#ffffff !important;border:1px solid #e4e6e9 !important;color:#33373d}
.bizinfo strong,.bizinfo b,.bizinfo h3,.bizinfo h4,.bizinfo dt{color:#16202E}
.bizinfo a{color:#195080}

/* ---- CALLOUT / NOTE / AI-EXCERPT -> světlé červeně tónované ---- */
.callout{background:rgba(27,86,136,.05);border-left:6px solid var(--yellow)}
.callout h3{color:#134266}.callout p{color:#464b52}
.note,.ai-excerpt,.section--dark .note,.section--dark .ai-excerpt{background:rgba(27,86,136,.06) !important;color:#464b52 !important}

/* ---- CHIPS / AREAS ---- */
.areas span,.section--dark .areas span{color:#33373d;background:#ffffff;border:1px solid #d8dbdf}

/* ---- TLAČÍTKA ghost na světlém ---- */
.btn--ghost,.section--dark .btn--ghost{color:#23262b;border-color:rgba(0,0,0,.4)}
.btn--ghost:hover,.section--dark .btn--ghost:hover{background:#23262b;color:#fff;border-color:#23262b}

/* ---- FAQ -> světlé, červené akcenty ---- */
.faq details{border-left:3px solid #e0e2e5}
.faq details:hover{border-left-color:#1B5688}
.faq summary{color:#16202E}.faq details p{color:#464b52}

/* ---- STRIP / TOPBAR / BLOGNOTE -> světlé ---- */
.strip{background:#f3f4f5;color:#3b4046;border-top:4px solid #1B5688}
.strip__inner{color:#3b4046}.strip__inner span{border-left-color:#e2e4e5}
.topbar{background:#f1f2f2 !important;color:#3b4046;border-bottom:1px solid #e2e4e5 !important}
.topbar__item{color:#3b4046}.topbar__phone strong{color:#195080}.topbar__loc{color:#7c8085}
.blognote{background:#f1f2f2;color:#3b4046;border-bottom:1px solid #e4e6e7}
.blognote__txt strong{color:#17181a}.blognote__link{color:#195080}.blognote__link:hover{color:#134266}

/* ---- CTA -> červený pás ---- */
.section--cta{background:linear-gradient(135deg,#1B5688 0%,#134266 100%) !important;color:#fff}
.section--cta h2,.section--cta .h2{color:#fff}
.section--cta .eyebrow{color:#ffffff}
.section--cta .eyebrow::before{background:#ffffff}
.section--cta p,.section--cta .lead{color:#D9E8F5}
.section--cta .btn--primary{background:#ffffff;color:#195080}
.section--cta .btn--primary:hover{background:#f1f1f1;color:#134266}
.section--cta .btn--ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.section--cta .btn--ghost:hover{background:#fff;color:#195080;border-color:#fff}
.section--cta .form{background:#ffffff !important;border:1px solid rgba(0,0,0,.08) !important;box-shadow:0 14px 40px rgba(0,0,0,.22)}
.section--cta .form input,.section--cta .form select,.section--cta .form textarea{background:#ffffff !important;color:#17181a !important;border:1px solid #cfd3d8 !important}
.section--cta .form input::placeholder,.section--cta .form textarea::placeholder{color:#9aa0a6 !important}
.section--cta .form .check{color:#3b4046}.section--cta .form label{color:#195080}

/* ---- HERO (fotobanner zůstává) – červené akcenty ---- */
.hero__mark{color:#ffffff}
.hero .eyebrow{color:#73B4E6}
.hero .eyebrow::before{background:#73B4E6}
.hero__usps strong{color:#73B4E6}
.hero__refs{color:#cfd3d8}

/* ---- PATIČKA -> tmavě uhlová (ukotvení světlé stránky) ---- */
.footer{background:#16202E;color:#c7cacd}
.footer h4{color:#ffffff}.footer a{color:#c7cacd}.footer a:hover{color:#8CC0EC}

/* ---- doladění čitelnosti světlého motivu ---- */
.section--dark .checklist li{color:#3b4046}
.section--dark .ai-excerpt--full strong,.ai-excerpt strong,.ai-excerpt--full strong{color:#134266}
.header .btn--phone-sm{background:#23262b;color:#fff;border-color:#23262b}

/* ---- E-mail v hlavičce (přesun z bývalého topbaru); na širších obrazovkách ---- */
.header__mail{display:none;align-items:center;gap:7px;color:#3a4654;font-family:'Oswald',sans-serif;font-size:13px;font-weight:500;letter-spacing:.5px;white-space:nowrap;margin-right:4px}
.header__mail .ico{width:15px;height:15px;color:#1B5688}
.header__mail:hover{color:#195080}
@media (min-width:1440px){.header__mail{display:inline-flex}}

/* ---- Patička: spodní řádek + výzva na oficiální web (přesun z horní lišty) ---- */
.footer__bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:10px 24px;flex-wrap:wrap}
.footer__official{color:#aab2bd;font-size:12.5px}
.footer__official a{color:#8CC0EC;font-weight:600;white-space:nowrap}
.footer__official a:hover{color:#b6d8f2;text-decoration:underline}
@media (max-width:680px){.footer__bottom-inner{justify-content:center;text-align:center;gap:6px}}

/* =====================================================================
   MOBIL: přepracovaný hero – DOMINUJE VĚŽ (kostel); čistší kompozice
   + odstranění plovoucího podpisu „ANDĚL & spol." (a ghost vrstvy)
   ===================================================================== */
@media (max-width:680px){
  .hero{min-height:92vh;padding:0;align-items:flex-end}
  .hero__bg{background-position:24% 33%}
  .hero__overlay{background:linear-gradient(180deg,
     rgba(11,18,30,.16) 0%,rgba(11,18,30,.04) 22%,
     rgba(11,18,30,.28) 48%,rgba(11,18,30,.72) 75%,rgba(11,18,30,.94) 100%)}
  .hero__inner{padding:0 20px 40px}
  .hero__cta{margin-bottom:0}
  .hero__mark-sig,.hero__ghost{display:none !important}   /* plovoucí „ANDĚL & spol." pryč */
  .hero__refs{display:none}                                /* redundantní s referencemi níže */
}
@media (max-width:560px){
  .hero{min-height:88vh}
}

/* ===================================================================
   FINÁLNÍ PRODUKČNÍ DOLADĚNÍ — stabilita, čistota, konzistence, prémium
   =================================================================== */

/* (4,6,19) Pryč s rušivými plovoucími prvky: pravé šipky (secnav) + dot-navigace.
   Navigace zůstává v hlavičce a v hamburger menu. */
.secnav,.dotnav{display:none !important}

/* (3) Pojistka proti vodorovnému přetečení (clip nerozbíjí sticky header) */
html{overflow-x:clip}
body{overflow-x:clip;max-width:100%}
.revslider,.revslider__viewport,.revslider__track{max-width:100%}
img,svg,video,iframe{max-width:100%}

/* (1) HLAVIČKA — stabilní, prémiová, nikdy nepřetéká */
.header__inner{flex-wrap:nowrap;min-width:0;gap:clamp(16px,2vw,30px)}
.nav{min-width:0;flex-wrap:nowrap;gap:clamp(14px,1.5vw,24px)}
.nav a{white-space:nowrap}
.nav__ico{width:16px;height:16px;opacity:.8}
@media (min-width:1025px) and (max-width:1300px){
  .nav{gap:14px;font-size:13px;letter-spacing:.4px}
  .nav__ico{display:none}                       /* užší desktop: čistý text-only header */
}
@media (min-width:1301px){
  .header__inner{padding-left:clamp(24px,3vw,48px);padding-right:clamp(24px,3vw,48px)}
}

/* (2) HERO — bezpečné šířky; zvýrazňovací blok „horolezeckou technikou" se neusekne */
.hero__mark{white-space:normal;max-width:100%}
.hero h1{overflow-wrap:break-word}
.revslider{margin-left:auto;margin-right:auto}

/* (4) TABLET 681–1024 — vlastní kompozice, profesionální využití šířky */
@media (min-width:681px) and (max-width:1024px){
  .container{padding-left:clamp(24px,4vw,44px);padding-right:clamp(24px,4vw,44px)}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;margin-left:0;margin-right:0}
  .contact{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;margin-left:0;margin-right:0}
  .terminy{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;margin-left:0;margin-right:0}
  .refs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
}

/* (9,12,18) Prémiovější karty a typografie na desktopu */
@media (min-width:1025px){
  .card p{font-size:15.5px;line-height:1.66}
  .feat p{font-size:15px;line-height:1.6}
}

/* (5) MOBILNÍ HERO — sekundární CTA čitelné, benefity vzdušnější */
@media (max-width:680px){
  .hero .btn--ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.85);color:#fff;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
  .hero__usps{gap:18px 16px}
}

/* (6,15,16) MOBIL — sticky CTA nikdy nepřekrývá obsah/formulář/kontakt */
@media (max-width:680px){
  .footer{padding-bottom:24px}
  #poptavka,#kontakt{scroll-margin-bottom:96px}
}

/* (15) FORMULÁŘ — prémiové fokus stavy (modrý prsten) */
.form input:focus,.form select:focus,.form textarea:focus,
.section--cta .form input:focus,.section--cta .form select:focus,.section--cta .form textarea:focus{
  outline:none;border-color:#1B5688;box-shadow:0 0 0 3px rgba(27,86,136,.16)}

/* ===================================================================
   AUDIT KONTRASTU + PRÉMIOVÉ DOLADĚNÍ ČITELNOSTI
   =================================================================== */

/* (1) Tlačítko „Zobrazit více realizací" – prémiové a čitelné na světlém
   (původně bílý text na téměř průhledném světlém gradientu = nečitelné) */
.btn-more{color:#16202E !important;background:#ffffff !important;
  border:1.6px solid #1B5688 !important;
  box-shadow:0 6px 18px rgba(20,22,26,.07) !important}
.btn-more::before,.btn-more__glow{display:none !important}
.btn-more:hover{color:#ffffff !important;background:#1B5688 !important;border-color:#1B5688 !important;
  box-shadow:0 14px 30px rgba(27,86,136,.28) !important}
.btn-more__chev{color:inherit}
.clients.is-expanded .clients__list .clients__more .btn-more__label{color:inherit !important}

/* (2) Slider hodnocení = tmavá námořní karta. Opraví bílý text (byl na světlém)
   a zároveň jasně odliší HODNOCENÍ od bílých karet REALIZACÍ. */
.revslider__viewport{background:linear-gradient(180deg,#1c2c44,#16202e) !important;
  border:1px solid #2a3a52 !important;border-left:3px solid #1B5688 !important;
  box-shadow:0 26px 60px rgba(11,18,30,.30) !important}
.revslide__quote{color:#e7eef6 !important}
.revslide__meta strong{color:#ffffff !important}
.revslide__pct{color:#ffffff !important}
.revstars{-webkit-text-stroke:0 !important;text-shadow:none !important;color:#73B4E6 !important}

/* (3) Reference „Pro koho" – názvy tmavé na světlém (byly bílé) */
.ref__name{color:#16202E}
.ref__tag{color:#6b7079}

/* (4) Kontakt – fakturační hodnoty (IČO, sídlo, datová schránka) tmavé na bílé kartě */
.bizinfo__row dd{color:#16202E}
.bizinfo__row dt{color:#6b7079}

/* (5) Opakovaný kurz / course-repeat – tmavý čitelný text na světlém */
.course-repeat__info h3{color:#16202E}
.course-repeat__info p{color:#454b52}

/* (6) Globální čitelnost – ztmavení příliš světlých „muted" textů + meta */
.card__meta{color:#6b7079 !important}
.clients__label{color:#586271}
.review__meta{color:#6b7079}

/* (7) Oprava bílého textu na světlém v „O společnosti" (mobil) a v bloku vybavení */
.wht-m{color:inherit}
.wht-m strong{color:#16202E}
@media (max-width:600px){ .wht-m,.wht-m strong{color:#16202E !important} }
.affekt__brand{color:#2f3640}
.affekt__brand:hover{color:#16202E;background:rgba(27,86,136,.07)}

/* =====================================================================
   MOBIL — PRÉMIOVÁ ÚVODNÍ OBRAZOVKA: celý kostel + jen základní informace
   (vše ostatní jde pod fold; spodní sticky CTA zůstává čisté)
   ===================================================================== */
@media (max-width:680px){
  .hero{min-height:100vh;min-height:100svh}
  .hero__bg{background-position:24% 31%}
  .hero__inner{padding:0 22px 40px}

  /* základní info: krátký hook (2 řádky) + jedno primární CTA */
  .hero__sub{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    max-width:none;margin-bottom:22px;font-size:15.5px;line-height:1.5;color:#e0e6ed}
  .hero__cta{margin-bottom:0}
  .hero__cta .btn--ghost{display:none}     /* na úvodní obrazovce jen primární akce */

  /* vše ostatní pryč z úvodní obrazovky (zůstává níže/na webu) */
  .hero__usps,.hero__refs,.ref-jump--hero,
  .hero__mark-sig,.hero__ghost{display:none !important}
}

/* Sticky lišta skrytá na úvodní obrazovce (mobil) – čistý kostel + základní info */
.sticky-bar.is-hidden{opacity:0;pointer-events:none}

/* ===================================================================
   OPRAVY: černé písmo/ikony na modrém podkladu -> bílé (čitelné, prémiové)
   =================================================================== */
/* telefonní CTA „Zavolat 608 800 618" (callout) – modrá s prémiovým gradientem, bílý text i ikona */
.btn--yellow{background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;color:#ffffff !important;
  border:none !important;box-shadow:0 8px 22px rgba(27,86,136,.34),inset 0 1px 0 rgba(255,255,255,.18) !important}
.btn--yellow:hover{background:linear-gradient(180deg,#2A74AE 0%,#163F63 100%) !important;color:#ffffff !important}
.btn--yellow .ico{color:#ffffff !important}
/* badge na kartách – modrá + bílý text */
.card__badge{background:#1B5688 !important;color:#ffffff !important}
/* štítek termínu – modrá pilulka, bílý text */
.termin__tag b{background:#1B5688 !important;color:#ffffff !important}
.termin__tag b.op{background:#ffffff !important;color:#16202E !important}
/* sticky telefon (mobil) – modrá s bílým textem i ikonou */
.sticky-btn--phone{background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;color:#ffffff !important}
.sticky-btn--phone .ico{color:#ffffff !important}

/* (2) MOBILNÍ HERO „Zavolat nyní“ – světlý podklad, aby vyniklo na fotce */
@media (max-width:680px){
  .hero__cta .btn--call,
  .hero__cta .btn--call.hero-call--activate{
    background:#ffffff !important;color:#16202E !important;border:none !important;
    box-shadow:0 14px 30px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.6) !important;
    font-weight:700}
  .hero__cta .btn--call .ico{color:#1B5688 !important}
  .hero__cta .btn--call:hover{background:#eaf1f8 !important;color:#0f2740 !important}
}

/* ===================================================================
   PRÉMIOVÉ DOTAŽENÍ SEKCÍ — vizuál „web za 150 000 Kč"
   =================================================================== */

/* (A) Jednotný prémiový tvar + vrstvený stín + hover lift napříč kartami */
.card,.feat,.client,.contact__card,.kb article,.review{
  border-radius:13px !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 14px 32px rgba(16,24,40,.06) !important;
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s ease,border-color .3s ease !important}
.card:hover,.feat:hover,.client:hover,.contact__card:hover,.review:hover{
  transform:translateY(-5px);
  box-shadow:0 10px 18px rgba(16,24,40,.08),0 28px 56px rgba(16,24,40,.14) !important}

/* (B) Prémiový rytmus nadpisů sekcí */
.section .h2{letter-spacing:-.006em}
.section__head,.section > .container > .lead{margin-bottom:8px}

/* (C) #realizace — klientské karty (nejdůležitější sekce) */
.client{border-left-width:3px !important}
.client > summary{font-size:19.5px !important;padding:20px 22px !important;letter-spacing:.2px}
.client__detail{padding:2px 22px 20px !important}
.clients__label{font-size:12px;letter-spacing:2.4px;color:#5a6472}
.btn-more{padding:16px 34px !important;letter-spacing:1.8px;font-size:14.5px !important}

/* (D) #pro-koho — čísla 01–09 prémiově + jemné oddělení */
.refs{border-top:1px solid #e6e9ee}
.ref{border-bottom:1px solid #eef0f3;transition:background .25s ease,padding-left .25s ease}
.ref:hover{background:linear-gradient(90deg,rgba(27,86,136,.055),rgba(27,86,136,0) 60%)}
.ref::before{color:#1B5688 !important;-webkit-text-stroke:0 !important;font-weight:700 !important;opacity:1 !important}

/* (E) #prubeh — kroky prémiově (čitelnější čísla + jemný hover) */
@media (min-width:681px){
  .steps li{transition:transform .28s ease}
  .steps li:hover{transform:translateY(-4px)}
}
.steps li h3{letter-spacing:.2px}

/* (F) Formulář poptávky — prémiové vstupy a karta */
.section--cta .form{border-radius:18px !important;padding:34px !important;
  box-shadow:0 28px 64px rgba(11,18,30,.20) !important}
.form input,.form select,.form textarea{border-radius:11px !important;padding:14px 16px !important;
  font-size:15px !important;transition:border-color .2s ease,box-shadow .2s ease}
.form .check{gap:11px}
.section--cta .form .btn,.section--cta .form button{border-radius:11px !important;letter-spacing:1.6px}

/* (G) #kontakt — prémiové karty + ikony */
.contact__card{border-radius:15px !important;padding:30px 28px !important}
.contact__card .ico{color:#1B5688}
.contact__cta{letter-spacing:1.4px}

/* (H) Hodnocení — prémiové ovládací prvky slideru */
.revslider__arrow{border-radius:50% !important;transition:background .2s ease,transform .2s ease}
.revslider__arrow:hover{transform:scale(1.08)}

/* ===================================================================
   SJEDNOCENÉ SLUŽBY — jedna galerie + komplexní výpis (prémiové)
   =================================================================== */
.svc{display:grid;grid-template-columns:1.12fr .88fr;gap:50px;align-items:center;margin-top:42px}
.svc__gallery{position:relative;border-radius:18px;overflow:hidden;background:#0c1320;
  box-shadow:0 1px 2px rgba(11,18,30,.1),0 34px 70px rgba(11,18,30,.22)}
.svc__stage{position:relative;width:100%;aspect-ratio:4/3}
.svc__slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.035);transition:opacity .9s ease,transform 6s ease}
.svc__slide.is-active{opacity:1;transform:scale(1)}
.svc__nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;
  border:1px solid rgba(255,255,255,.25);background:rgba(11,18,30,.46);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;z-index:3;opacity:0;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:opacity .25s ease,background .2s ease,transform .2s ease}
.svc__gallery:hover .svc__nav,.svc__nav:focus-visible{opacity:1}
.svc__nav svg{width:22px;height:22px}
.svc__nav--prev{left:14px}.svc__nav--next{right:14px}
.svc__nav:hover{background:#1B5688;border-color:#1B5688;transform:translateY(-50%) scale(1.07)}
.svc__caption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:46px 20px 16px;z-index:2;
  color:#fff !important;font-size:13.5px;line-height:1.45;font-weight:500;
  background:linear-gradient(180deg,transparent,rgba(8,13,22,.86))}
.svc__dots{position:absolute;top:16px;right:16px;display:flex;gap:7px;z-index:3}
.svc__dot{width:8px;height:8px;border-radius:50%;border:none;padding:0;cursor:pointer;
  background:rgba(255,255,255,.55);transition:background .2s ease,width .25s ease}
.svc__dot.is-active{background:#fff;width:22px;border-radius:5px}

.svc__intro{font-size:18px;color:#2b323b !important;margin:0 0 24px;font-weight:600;line-height:1.5}
.svc__list{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-direction:column;gap:20px}
.svc__item{display:grid;grid-template-columns:42px 1fr;gap:16px;align-items:start;
  padding-bottom:20px;border-bottom:1px solid #ebedf0}
.svc__item:last-child{border-bottom:none;padding-bottom:0}
.svc__check{width:40px;height:40px;border-radius:11px;flex:none;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,rgba(27,86,136,.14),rgba(27,86,136,.07));color:#1B5688;
  box-shadow:inset 0 0 0 1px rgba(27,86,136,.16)}
.svc__check svg{width:21px;height:21px}
.svc__item h3{font-family:'Oswald',sans-serif;font-size:18.5px;letter-spacing:.3px;color:#16202E !important;margin:0 0 6px}
.svc__item p{font-size:14.5px;line-height:1.62;color:#4b525a !important;margin:0}
.svc__link{display:inline-block;margin-top:9px;color:#195080;font-weight:600;font-size:14px;letter-spacing:.2px}
.svc__link:hover{text-decoration:underline;color:#134266}
.svc__cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}

@media (max-width:980px){
  .svc{grid-template-columns:1fr;gap:30px;margin-top:32px}
  .svc__gallery{order:-1}
}
@media (max-width:560px){
  .svc__stage{aspect-ratio:1/1}
  .svc__nav{opacity:1;width:42px;height:42px}
  .svc__cta{flex-direction:column;align-items:stretch}
  .svc__cta .btn{width:100%}
  .svc__intro{font-size:16.5px}
}

/* ===================================================================
   OPRAVY + PRÉMIOVÉ DOTAŽENÍ (hero CTA, texty, separator, pro-koho, realizace)
   =================================================================== */

/* (1) HERO „Nezávazně poptat práci" – čitelné i na desktopu (bylo tmavé na tmavé) */
.hero .btn--ghost{
  background:rgba(255,255,255,.10) !important;
  border:1.6px solid rgba(255,255,255,.9) !important;
  color:#ffffff !important;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.hero .btn--ghost:hover{background:#ffffff !important;color:#16202E !important;border-color:#ffffff !important}

/* (2) ČITELNOST – hlavní odstavce zarovnat doleva (justify tříštil řádky) */
.hero__sub,#sluzby .lead,.card__body > p:not(.card__meta),
#bezpecnost .lead,#o-nas .split__content > p,#reference .lead,#cenik p,
.svc__intro,.svc__item p{
  text-align:left !important;-webkit-hyphens:manual !important;hyphens:manual !important}

/* (4) LOGO SEPARATOR – transparentní (zrušit šedý box i čáru pod ním) */
.sec-link{background:transparent !important;padding:0 !important}
.sec-link img{filter:drop-shadow(0 3px 9px rgba(11,18,30,.35))}
#proc > .container::before{display:none !important}

/* (1.b) PRO KOHO PRACUJEME – prémiové karty s velkými čísly 01–09 */
.refs{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;border-top:none !important;margin-top:42px}
.ref{display:flex !important;flex-direction:column !important;align-items:flex-start !important;
  gap:6px !important;grid-template-columns:none !important;
  padding:28px 26px !important;background:#ffffff !important;
  border:1px solid #e6e9ee !important;border-radius:15px !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 14px 30px rgba(16,24,40,.05) !important;
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s ease,border-color .3s ease !important;
  position:relative;overflow:hidden}
.ref::after{content:"";position:absolute;left:0;top:0;width:48px;height:3px;
  background:linear-gradient(90deg,#1B5688,#73B4E6)}
.ref::before{position:static !important;font-family:'Oswald',sans-serif;font-weight:700 !important;
  font-size:30px !important;line-height:1 !important;letter-spacing:1px !important;
  color:#1B5688 !important;opacity:.92 !important;margin-bottom:6px;-webkit-text-stroke:0 !important}
.ref:hover{transform:translateY(-6px) !important;padding-left:26px !important;
  box-shadow:0 10px 18px rgba(16,24,40,.08),0 30px 56px rgba(16,24,40,.14) !important;
  border-color:#cdd6e1 !important;background:#ffffff !important}
.ref:hover::before{color:#134266 !important}
.ref__name{font-family:'Oswald',sans-serif;font-size:19px !important;color:#16202E !important;
  letter-spacing:.2px !important;justify-self:auto !important;text-align:left !important;text-transform:none}
.ref__tag{justify-self:auto !important;text-align:left !important;color:#6b7079 !important;
  font-size:12px !important;letter-spacing:1.6px !important}
@media (max-width:980px){.refs{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media (max-width:560px){.refs{grid-template-columns:1fr !important}}

/* (3) VYBRANÍ ZÁKAZNÍCI A REALIZACE – modernější, prémiový vizuál */
.client{border-radius:15px !important;border:1px solid #e6e9ee !important;border-left:3px solid #1B5688 !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 14px 30px rgba(16,24,40,.05) !important;overflow:hidden}
.client:hover{transform:translateY(-4px);border-color:#cdd6e1 !important;border-left-color:#1B5688 !important;
  box-shadow:0 10px 18px rgba(16,24,40,.08),0 30px 56px rgba(16,24,40,.14) !important}
.client > summary{font-family:'Oswald',sans-serif;font-size:19px !important;font-weight:700;
  padding:22px 24px !important;letter-spacing:.2px;transition:background .2s ease,color .2s ease}
.client:not([open]) > summary:hover{background:rgba(27,86,136,.04)}
/* ovládací +/− – modré na bílé kartě, bílé na otevřené námořní kartě */
.client > summary::after{border-color:rgba(27,86,136,.35) !important;
  background-image:linear-gradient(#1B5688,#1B5688),linear-gradient(#1B5688,#1B5688) !important}
.client[open] > summary::after{border-color:rgba(255,255,255,.55) !important;
  background-image:linear-gradient(#ffffff,#ffffff),linear-gradient(#ffffff,#ffffff) !important}
.client[open]{box-shadow:0 18px 44px rgba(11,18,30,.22) !important;border-left-color:#73B4E6 !important}
/* štítek „Specifika a bezpečnost" – prémiová pilulka */
.client__spec::before{display:inline-block !important;padding:4px 11px !important;border-radius:999px !important;
  background:rgba(115,180,230,.16) !important;color:#9fc6ea !important;letter-spacing:1.8px !important;
  font-size:10px !important;margin-bottom:10px !important}

/* ===================================================================
   #vykon — sjednocené činnosti: 8 boxů (velké), 6 na mobilu
   =================================================================== */
.kb{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:18px !important}
.kb article{background:#ffffff;border:1px solid #e6e9ee;border-radius:14px;padding:24px 22px;
  border-top:3px solid #1B5688;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 12px 28px rgba(16,24,40,.05);
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s ease,border-color .3s ease}
.kb article:hover{transform:translateY(-5px);
  box-shadow:0 10px 18px rgba(16,24,40,.08),0 26px 52px rgba(16,24,40,.13);border-color:#cdd6e1}
.kb h3{font-family:'Oswald',sans-serif;font-size:17px !important;color:#16202E !important;
  letter-spacing:.2px;margin-bottom:9px;line-height:1.25}
.kb p{font-size:14px;line-height:1.6;color:#4b525a;margin:0;text-align:left}

@media (min-width:1025px) and (max-width:1320px){
  .kb{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
}
@media (min-width:681px) and (max-width:1024px){
  .kb{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media (max-width:680px){
  .kb{grid-template-columns:minmax(0,1fr) !important}
  .kb__hide-m{display:none !important}   /* na mobilu 6 boxů (2 specializované skryté) */
}

/* oprava starého „tabulkového" stylu .kb (šedý podklad/overflow/rohový trojúhelník) */
.kb{background:transparent !important;border:none !important;overflow:visible !important;
  border-radius:0 !important;margin-top:42px !important}
.kb article::before{display:none !important}

/* ===================================================================
   OPRAVY: hlavička (e-mail), sekce služeb (vyvážení + modernizace)
   =================================================================== */
/* (2) E-mail v hlavičce se na některých šířkách překrýval s menu → odebrán z lišty
   (zůstává v patičce i v sekci Kontakt). Hlavička je čistší a stabilní. */
.header__mail{display:none !important}

/* (3) SEKCE SLUŽEB – galerie vyvážená vůči textu, moderní kompozice */
@media (min-width:981px){
  .svc{grid-template-columns:1fr 1fr !important;gap:46px !important;align-items:stretch !important}
  .svc__gallery{align-self:stretch}
  .svc__stage{aspect-ratio:auto !important;height:100% !important;min-height:460px}
}
.svc__gallery{box-shadow:0 1px 2px rgba(11,18,30,.1),0 30px 64px rgba(11,18,30,.20),
  inset 0 0 0 1px rgba(255,255,255,.06) !important}
.svc__caption{padding:52px 22px 18px !important;font-size:14px !important}
.svc__content{display:flex;flex-direction:column;justify-content:center}
.svc__intro{font-size:19px !important;margin:0 0 26px !important}
.svc__item h3{font-size:19px !important}
.svc__item p{font-size:15px !important;line-height:1.65 !important}

/* ===================================================================
   ÚPRAVY: hero text (mobil), galerie ALT, odkazy, hodnocení popis+šipky
   =================================================================== */

/* (1) MOBIL – zobrazit CELÝ hero text prémiově (bez ořezu „…") */
@media (max-width:680px){
  .hero__sub{
    -webkit-line-clamp:unset !important;display:block !important;overflow:visible !important;
    font-size:14.5px !important;line-height:1.64 !important;color:#e4eaf1 !important;
    margin-bottom:22px !important;text-shadow:0 1px 12px rgba(8,13,22,.85);
    text-align:left !important}
  /* silnější spodní ztmavení kvůli čitelnosti delšího textu */
  .hero__overlay{background:linear-gradient(180deg,
     rgba(11,18,30,.15) 0%,rgba(11,18,30,.04) 18%,
     rgba(11,18,30,.34) 42%,rgba(11,18,30,.78) 68%,rgba(11,18,30,.95) 100%) !important}
  .hero{min-height:100svh}
  .hero__bg{background-position:26% 28% !important}
  .hero__inner{padding-bottom:36px}
}

/* (2) GALERIE – skrýt viditelný popisek (ALT/title zůstávají pro SEO/přístupnost) */
.svc__caption{display:none !important}

/* (3) ODKAZY – bílé odkazy na světlém pozadí -> čitelná modrá (jednotný styl) */
.poptavej-inline,.ext-records{color:#195080 !important;border-bottom-color:rgba(25,80,128,.4) !important}
.poptavej-inline:hover,.ext-records:hover{color:#134266 !important;border-bottom-color:rgba(19,66,102,.7) !important}

/* (4) HODNOCENÍ – popis zakázky pod jménem: světlejší, čitelný na námořní kartě */
.revslide__meta span{color:#a9b8ca !important;font-size:13px;letter-spacing:.2px;line-height:1.4}

/* (5) HODNOCENÍ – ovládací šipky výraznější a prémiové */
.revslider__arrow{width:52px !important;height:52px !important;
  background:#ffffff !important;border:1.6px solid #1B5688 !important;color:#1B5688 !important;
  box-shadow:0 6px 16px rgba(16,24,40,.12) !important;
  transition:background .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease !important}
.revslider__arrow:hover{background:#1B5688 !important;color:#ffffff !important;border-color:#1B5688 !important;
  transform:scale(1.08);box-shadow:0 12px 26px rgba(27,86,136,.34) !important}
.revslider__arrow svg{width:22px;height:22px}

/* (7) MOBIL – odstranit šedý pás se seznamem služeb (desktop/tablet beze změny) */
@media (max-width:680px){ .strip{display:none !important} }

/* ===================================================================
   PRÉMIOVÁ GALERIE – rám s „matnou", výškově srovnaný s CTA boxem
   =================================================================== */
.svc__gallery{
  position:relative; display:block; box-sizing:border-box;
  padding:14px; border-radius:22px; overflow:hidden;
  background:linear-gradient(158deg,#1c2940 0%,#141f30 46%,#0e1826 100%) !important;
  box-shadow:
    0 2px 4px rgba(11,18,30,.14),
    0 40px 80px -22px rgba(11,18,30,.44),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 0 0 1px rgba(255,255,255,.06) !important;
}
/* jemný horní světelný nádech rámu (viditelný jen na matné kolem fotky) */
.svc__gallery::before{
  content:""; position:absolute; left:0; right:0; top:0; height:46%; z-index:0;
  background:linear-gradient(180deg,rgba(255,255,255,.07),transparent); pointer-events:none;
}
.svc__stage{
  position:relative; z-index:1; width:100%;
  aspect-ratio:16/11; border-radius:13px; overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12), 0 16px 36px rgba(0,0,0,.45);
}
.svc__slide{border-radius:13px}
/* jemná spodní vinětace pro hloubku a čitelnost ovládání */
.svc__stage::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; border-radius:13px;
  background:linear-gradient(180deg,transparent 60%,rgba(8,13,22,.30));
}
/* ovládání usazené dovnitř fotky (posun o matnou) */
.svc__nav{width:50px; height:50px; background:rgba(11,18,30,.5); border:1.4px solid rgba(255,255,255,.55)}
.svc__nav--prev{left:26px} .svc__nav--next{right:26px}
.svc__nav:hover{background:#1B5688; border-color:#ffffff}
.svc__dots{top:auto; bottom:26px; left:50%; right:auto; transform:translateX(-50%)}
.svc__dot{background:rgba(255,255,255,.5)}
.svc__dot.is-active{background:#ffffff; width:24px}

/* DESKTOP – rám vyplní celou výšku vedle CTA boxu (jeden kompaktní blok) */
@media (min-width:981px){
  .svc{align-items:stretch !important}
  .svc__gallery{display:flex; height:100% !important; align-self:stretch}
  .svc__stage{flex:1 1 auto; min-height:0; height:auto !important; aspect-ratio:auto !important; min-height:480px}
}
/* menší zobrazení – rám zůstává, jen jemnější proporce (nerozbít) */
@media (max-width:980px){ .svc__stage{aspect-ratio:16/10} }
@media (max-width:560px){ .svc__gallery{padding:11px; border-radius:18px} .svc__stage{aspect-ratio:4/3} }

/* Fotka „horolezci na střeše nad Táborem" – vycentrovat, aby byla vidět
   dominanta Tábora (věž kostela vlevo) i pracovníci. Platí pro PC i mobil. */
.svc__slide[src*="horolezci-strecha-tabor"]{object-position:30% 40% !important}

/* ===================================================================
   PRÉMIOVÝ HERO – mobil i tablet (≤1024): dominuje věž, minimum info,
   pitch a doplňky až při scrollu (v sekcích níže) + scroll cue
   =================================================================== */
@media (max-width:1024px){
  .hero{min-height:100svh; align-items:stretch; padding:0; overflow:hidden}
  .hero__bg{background-position:27% 30% !important}
  /* prémiové ztmavení jen ve spodní části – věž nahoře čistá a světlá */
  .hero__overlay{background:linear-gradient(180deg,
     rgba(11,18,30,.10) 0%, rgba(11,18,30,.02) 24%,
     rgba(11,18,30,.26) 54%, rgba(11,18,30,.70) 80%, rgba(11,18,30,.93) 100%) !important}

  .hero__inner{
    display:flex; flex-direction:column; justify-content:flex-end;
    min-height:100svh; max-width:none; width:100%; box-sizing:border-box;
    padding:0 26px calc(76px + env(safe-area-inset-bottom));
  }
  /* jen nezbytné pro první dojem */
  .hero .eyebrow{color:#8CC0EC; padding-left:34px; font-size:12px; letter-spacing:3px; margin-bottom:16px}
  .hero h1{font-size:clamp(38px,8.6vw,66px); line-height:1.02; margin:0}
  .hero__lead{color:#fff}
  .hero__city{opacity:.72; font-weight:inherit}
  .hero__mark{font-size:clamp(14px,3.4vw,20px); padding:3px 12px; margin-top:14px}
  .hero__cta{margin-top:26px; margin-bottom:0}

  /* doplňky pryč z první obrazovky (objeví se níže / při scrollu) */
  .hero__sub,
  .hero__usps,.hero__refs,.ref-jump--hero,
  .hero__mark-sig,.hero__ghost,.hero__ghost-amp{display:none !important}
  .hero__cta .btn--ghost{display:none !important}   /* jen primární akce */
  .hero__cta .btn--primary{width:100%; max-width:420px; justify-content:center}

  /* jemný scroll cue – signalizuje obsah níže */
  .hero::after{
    content:""; position:absolute; left:50%; bottom:22px; width:16px; height:16px; z-index:3;
    border-right:2.4px solid rgba(255,255,255,.82); border-bottom:2.4px solid rgba(255,255,255,.82);
    transform:translateX(-50%) rotate(45deg);
    animation:heroScrollCue 1.9s ease-in-out infinite; pointer-events:none;
  }
}
@keyframes heroScrollCue{
  0%,100%{transform:translateX(-50%) rotate(45deg) translate(0,0); opacity:.45}
  50%{transform:translateX(-50%) rotate(45deg) translate(4px,4px); opacity:1}
}

/* ===================================================================
   HERO – finální vyladění fotky: prémiový modrý tón + dramatické,
   ale vyvážené ztmavení. Fotka je moody se komprimovanými světly,
   věž není přepálená; překryv jen sjednocuje a zajišťuje čitelnost.
   =================================================================== */
.hero__bg{filter:contrast(1.05) saturate(1.03) !important}
.hero__overlay{background:
  linear-gradient(rgba(15,34,60,.22), rgba(15,34,60,.12)),
  linear-gradient(104deg, rgba(8,14,24,.80) 0%, rgba(8,14,24,.52) 36%, rgba(8,14,24,.26) 64%, rgba(8,14,24,.12) 100%),
  linear-gradient(180deg, rgba(8,14,24,.06) 0%, rgba(8,14,24,.26) 60%, rgba(8,14,24,.58) 100%) !important}
@media (max-width:1024px){
  .hero__overlay{background:
    linear-gradient(rgba(15,34,60,.18), rgba(15,34,60,.10)),
    linear-gradient(180deg,
      rgba(8,14,24,.14) 0%, rgba(8,14,24,.02) 28%,
      rgba(8,14,24,.24) 56%, rgba(8,14,24,.70) 82%, rgba(8,14,24,.93) 100%) !important}
}

/* ===================================================================
   PRÉMIOVÁ SEKCE „Vybraní zákazníci a realizace" – kompletní přepracování
   (desktop 3 sloupce / tablet 2 / mobil 1 accordion), jednotný styl karet,
   sektorové chipy, zvýraznění významných referencí, čitelnost + hierarchie
   =================================================================== */

/* --- HLAVIČKA bloku --- */
#realizace{margin-top:66px !important}
#realizace .clients__label{
  display:block !important; white-space:normal !important;
  font-family:'Oswald',sans-serif !important; font-weight:700 !important;
  font-size:clamp(22px,2.6vw,30px) !important; letter-spacing:.2px !important;
  text-transform:none !important; color:#16202E !important; line-height:1.18 !important;
  margin:0 !important; padding:0 !important;
}
#realizace .clients__label::before{
  content:"REFERENCE A REALIZACE" !important; display:block !important;
  font-family:'Oswald',sans-serif; font-weight:600; font-size:12px; letter-spacing:2.8px;
  color:#1B5688; margin-bottom:12px; width:auto; height:auto;
  position:relative; padding-left:36px;
  background:linear-gradient(#1B5688,#1B5688) left center/24px 2px no-repeat;
}

/* --- MŘÍŽKA --- */
.clients__list{
  display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important; align-items:stretch !important; margin-top:28px !important;
  background:transparent !important; border:none !important; overflow:visible !important;
  border-radius:0 !important; counter-reset:none !important;
}

/* --- KARTA (jednotný styl) --- */
.client{
  position:relative !important; display:flex !important; flex-direction:column !important;
  background:#ffffff !important; border:1px solid #e6e9ee !important;
  border-left:1px solid #e6e9ee !important; border-radius:16px !important; overflow:hidden !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 16px 34px rgba(16,24,40,.06) !important;
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s ease,border-color .3s ease !important;
  margin:0 !important; padding:0 !important;
}
.client::after{
  content:"" !important; position:absolute !important; left:0; top:0; right:0; height:3px !important;
  background:linear-gradient(90deg,#cdd6e1,#e6e9ee) !important; z-index:2; border:none !important;
  width:auto !important; opacity:1 !important; transform:none !important;
}
.client:hover{
  transform:translateY(-5px) !important; border-color:#cfd8e2 !important;
  box-shadow:0 12px 22px rgba(16,24,40,.09),0 32px 62px rgba(16,24,40,.14) !important;
}
.client[open]{background:#ffffff !important}

/* --- SUMMARY (název + sektor) --- */
.client > summary{
  list-style:none !important; position:relative !important; display:block !important;
  padding:22px 24px 14px !important; border:none !important; border-bottom:none !important;
  background:transparent !important; font-family:'Oswald',sans-serif !important; cursor:default;
}
.client > summary::-webkit-details-marker{display:none !important}
/* SEKTOR chip */
.client > summary::before{
  content:attr(data-sector) !important; display:inline-block !important; position:static !important;
  font-family:'Oswald',sans-serif !important; font-weight:600 !important; font-size:10.5px !important;
  letter-spacing:1.5px !important; text-transform:uppercase !important; color:#1B5688 !important;
  background:rgba(27,86,136,.09) !important; border:1px solid rgba(27,86,136,.18) !important;
  padding:4px 11px !important; border-radius:999px !important; margin:0 0 12px 0 !important;
  -webkit-text-stroke:0 !important; opacity:1 !important; line-height:1 !important;
}
/* NÁZEV + právní forma */
.client .cn-d,.client .cn-m{
  font-family:'Oswald',sans-serif !important; font-weight:700 !important;
  font-size:clamp(17px,1.4vw,20px) !important; color:#16202E !important;
  letter-spacing:.2px !important; line-height:1.24 !important;
}
.client .clients__lf{
  color:#8a9099 !important; font-weight:500 !important; font-size:13px !important;
  letter-spacing:.3px !important; margin-left:6px !important; text-transform:none !important;
}

/* --- VÝZNAMNÁ REFERENCE --- */
.client--featured::after{background:linear-gradient(90deg,#1B5688,#73B4E6) !important; height:4px !important}
.client--featured > summary::before{
  content:"★  " attr(data-sector) !important; color:#ffffff !important;
  background:linear-gradient(95deg,#1B5688,#22699e) !important; border-color:transparent !important;
}
.client--featured{box-shadow:0 1px 2px rgba(16,24,40,.05),0 18px 40px rgba(27,86,136,.13) !important}
.client--featured:hover{box-shadow:0 14px 24px rgba(27,86,136,.16),0 34px 66px rgba(27,86,136,.2) !important}

/* --- DETAIL (popis + specifika) --- */
.client__detail{padding:0 24px 22px !important; overflow:hidden}
.client__detail p{
  font-size:14.5px !important; line-height:1.62 !important; color:#48515c !important;
  margin:0 !important; text-align:left !important; border:none !important;
}
.client__detail p.client__spec{
  margin-top:14px !important; padding-top:15px !important;
  border-top:1px solid #edf0f3 !important; color:#6b7480 !important; font-size:13.5px !important;
}
.client__spec::before{
  content:"Specifika a bezpečnost" !important; display:inline-block !important;
  padding:0 0 0 21px !important; margin:0 0 8px 0 !important;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B5688' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v6c0 4-3 7-7 9-4-2-7-5-7-9V6l7-3z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E") left center/15px no-repeat !important;
  font-family:'Oswald',sans-serif !important; font-weight:600 !important; font-size:10.5px !important;
  letter-spacing:1.8px !important; text-transform:uppercase !important; color:#1B5688 !important;
  border-radius:0 !important; opacity:1 !important; line-height:1 !important;
}

/* --- ACCORDION šipka: jen mobil (desktop = karty trvale rozbalené) --- */
.client > summary::after{display:none !important}
@media (max-width:600px){
  .client > summary{cursor:pointer !important; padding-right:56px !important}
  .client > summary::after{
    display:block !important; content:"" !important; position:absolute !important;
    top:22px !important; right:20px !important; width:30px !important; height:30px !important;
    border-radius:50% !important; border:1.5px solid rgba(27,86,136,.28) !important;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B5688' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/15px no-repeat rgba(27,86,136,.05) !important;
    transition:transform .3s ease,background-color .2s ease,border-color .2s ease !important; margin:0 !important;
  }
  .client[open] > summary::after{transform:rotate(180deg) !important; border-color:#1B5688 !important; background-color:rgba(27,86,136,.1) !important}
  .client--featured > summary::after{border-color:rgba(27,86,136,.4) !important}
}

/* --- RESPONZIVITA mřížky --- */
@media (min-width:1025px) and (max-width:1300px){.clients__list{grid-template-columns:repeat(3,minmax(0,1fr)) !important}}
@media (min-width:601px) and (max-width:1024px){.clients__list{grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:16px !important}}
@media (max-width:600px){
  .clients__list{grid-template-columns:1fr !important; gap:14px !important}
  #realizace .clients__label{font-size:22px !important}
  .client > summary{padding:20px 20px 12px !important}
  .client__detail{padding:0 20px 20px !important}
}

/* --- „Zobrazit více realizací" – prémiové tlačítko --- */
.clients__more{margin-top:30px !important; display:flex; justify-content:center}
.btn-more{
  background:#ffffff !important; border:1.5px solid #d3dbe4 !important; border-radius:12px !important;
  padding:15px 30px !important; box-shadow:0 6px 18px rgba(16,24,40,.07) !important;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease !important;
}
.btn-more:hover{transform:translateY(-2px) !important; border-color:#1B5688 !important; box-shadow:0 12px 26px rgba(27,86,136,.16) !important}
.btn-more__label{color:#16202E !important; font-weight:600 !important; letter-spacing:.6px}
.btn-more__chev{color:#1B5688 !important}


/* =====================================================================
   MODERNIZACE 2026 — JEDNOTÍCÍ PRÉMIOVÁ VRSTVA (pouze vizuál)
   ---------------------------------------------------------------------
   Cíl: prohloubit prémiový dojem, sjednotit grafické detaily, zjemnit
   přechody mezi sekcemi a dotáhnout mikrodetaily napříč celým webem.
   Aditivní a bezpečné: nemění obsah, texty, SEO/AEO/GEO, strukturu ani
   funkčnost. Navazuje na stávající modrý systém (#1B5688 / #134266 /
   #73B4E6) a na jazyk měkkých vrstvených stínů a zaoblených karet.
   Respektuje prefers-reduced-motion.
   ===================================================================== */

:root{
  --m-accent:#1B5688;
  --m-accent-deep:#134266;
  --m-accent-soft:#73B4E6;
  --m-ink:#16202E;
  --m-ring:rgba(27,86,136,.16);
  --m-hairline:rgba(16,24,40,.07);
  --m-elev-1:0 1px 2px rgba(16,24,40,.04),0 10px 26px rgba(16,24,40,.05);
}

/* 1) TYPOGRAFIE — jemnější vykreslení písma (prémiová ostrost) --------- */
body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
.lead{line-height:1.62}

/* 2) VÝBĚR TEXTU — sjednocený do firemní modré ------------------------- */
::selection{background:rgba(27,86,136,.16);color:#0f2740}
::-moz-selection{background:rgba(27,86,136,.16);color:#0f2740}

/* 3) PŘECHODY MEZI SEKCEMI — čisté vlasové švy (rytmus scrollování) ---- */
/* Nezasahuje do layoutu (inset stín), jen crisp předěl bílá/šedá. */
#sluzby,#vykon,#bezpecnost,#proc,#prubeh,#o-nas,#cenik,#faq,#kontakt{
  box-shadow:inset 0 1px 0 var(--m-hairline);
}
/* Sekce referencí měly tmavou linku (#232629) na světlém podkladu –
   sjednoceno do jemné vlasové linky konzistentní se zbytkem webu. */
.section--refs{border-top-color:var(--m-hairline)}

/* 4) PRIMÁRNÍ TLAČÍTKA — plastičtější, prémiová hloubka ---------------- */
/* Zachovává barvy; přidává vrstvený stín + jemný horní světelný nádech. */
.btn--primary{
  box-shadow:
    0 2px 6px rgba(27,86,136,.26),
    0 12px 24px -8px rgba(27,86,136,.42),
    inset 0 1px 0 rgba(255,255,255,.16);
}
.btn--primary:hover{
  box-shadow:
    0 4px 10px rgba(27,86,136,.30),
    0 20px 34px -10px rgba(27,86,136,.5),
    inset 0 1px 0 rgba(255,255,255,.2);
}

/* 5) CTA PÁS (poptávka) — jemná světelná hloubka za formulářem --------- */
.section--cta{position:relative;overflow:hidden}
.section--cta > .container{position:relative;z-index:1}
.section--cta::after{
  content:"";position:absolute;z-index:0;pointer-events:none;
  top:-28%;left:50%;width:min(940px,120%);aspect-ratio:1/1;
  transform:translateX(-50%);
  background:radial-gradient(circle at 50% 42%,rgba(140,192,236,.20),transparent 62%);
}

/* 6) CHIPY „oblasti" (ceník) — prémiová pilulka + jemný hover ---------- */
.areas span{
  border-radius:999px;
  transition:transform .22s var(--ease,ease),border-color .22s ease,
             background .22s ease,box-shadow .22s ease;
}
.areas span:hover{border-color:#b9c6d6;box-shadow:0 5px 14px rgba(16,24,40,.06)}
@media (prefers-reduced-motion:no-preference){
  .areas span:hover{transform:translateY(-2px)}
}

/* 7) CALLOUT + NOTE — zaoblení a měkký stín konzistentní s kartami ----- */
.callout{
  border-radius:14px;
  box-shadow:var(--m-elev-1);
}
.note{border-radius:12px}

/* 8) FAQ — zaoblený pravý okraj + jemné zvýraznění na hover ------------ */
.faq details{
  border-radius:0 12px 12px 0;
  transition:background .22s ease,border-color .22s ease;
}
.faq details:hover{background:rgba(27,86,136,.035)}
.faq summary{transition:color .2s ease}

/* 9) DŮVĚRYHODNOSTNÍ PÁS (strip) — jemný hover jednotlivých položek ---- */
.strip__inner span{transition:color .2s ease,background .2s ease}
@media (min-width:761px){
  .strip__inner span:hover{color:var(--m-ink);background:rgba(27,86,136,.045)}
}

/* 10) CHECKLIST (bezpečnost) — vzdušnější, čitelnější řádkování -------- */
.checklist{gap:14px}
.checklist li{line-height:1.55}

/* 11) SEKČNÍ „eyebrow" — jemně zaoblená vodicí linka ------------------- */
.eyebrow--yellow::before,.eyebrow--black::before{border-radius:2px}

/* 12) PATIČKA — vlasový předěl + prémiové podtržení odkazů ------------- */
.footer__bottom{border-top:1px solid rgba(255,255,255,.07)}
.footer a{transition:color .2s ease}
.footer ul a:hover{text-decoration:underline;text-underline-offset:3px}

/* 13) SVG IKONY — jemné sjednocení tahů (crisp render) ---------------- */
svg{shape-rendering:geometricPrecision}

/* 14) SPLIT MÉDIA (bezpečnost / o nás) — jemné prosvětlení okraje ------ */
/* Přidává decentní vnitřní světelný lem k existujícímu rámu fotky. */
.split__media{box-shadow:0 26px 60px rgba(11,18,30,.28),inset 0 0 0 1px rgba(255,255,255,.05)}

/* 15) OBECNÝ POHYB — jemnější kadence hover-liftů (jen kde je povoleno) */
@media (prefers-reduced-motion:reduce){
  .section--cta::after{display:none}
}

/* =====================================================================
   OPRAVY REFERENCÍ + ZAROVNÁNÍ ODSTAVCŮ DO BLOKU (na vyžádání)
   Čistě vizuální a aditivní. Nemění obsah, texty, strukturu ani funkčnost.
   ===================================================================== */

/* (1) Významné reference – sektorový chip do světlé podoby
   (dříve tmavě modrá výplň s bílým textem). ★ ponechána jako jemný odznak. */
.client--featured > summary::before{
  content:attr(data-sector) !important;
  color:#1B5688 !important;
  background:rgba(27,86,136,.09) !important;
  border:1px solid rgba(27,86,136,.18) !important;
}

/* (2) Popisek „Specifika a bezpečnost" na vlastní řádek (dřív běžel do textu) */
.client__spec::before{ display:block !important; margin:0 0 8px 0 !important }

/* (3) Sektorový chip na vlastní řádek nad názvem (prémiový vzor „štítek → název")
   – řeší mačkání chipu s názvem i překryv na mobilu. */
.client > summary::before{
  display:block !important; width:max-content !important; max-width:100% !important;
  margin:0 0 11px 0 !important; white-space:nowrap !important;
}

/* (4) Tlačítko „Zobrazit / Skrýt další realizace" – inteligentně přes celou
   šířku i v ROZBALENÉM stavu, aby kolem něj nevznikal prázdný prostor v mřížce. */
@media (min-width:601px){
  .clients.is-expanded .clients__list .clients__more{
    grid-column:1 / -1 !important; align-self:auto !important; margin-top:30px !important;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more{
    width:auto !important; height:auto !important; min-height:0 !important;
    flex-direction:row !important; gap:10px !important;
    padding:16px 34px !important; border-radius:12px !important;
    background:#ffffff !important; border:1.5px solid #d3dbe4 !important;
    box-shadow:0 6px 18px rgba(16,24,40,.07) !important;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more:hover{
    transform:translateY(-2px) !important; border-color:#1B5688 !important;
    box-shadow:0 12px 26px rgba(27,86,136,.16) !important;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more__chev{
    width:18px !important; height:18px !important; padding:0 !important;
    border:none !important; background:none !important; border-radius:0 !important;
    color:#1B5688 !important;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more:hover .btn-more__chev{
    background:none !important; border:none !important; transform:rotate(180deg) !important;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more__label{
    color:#16202E !important; font-size:14.5px !important;
  }
  .clients.is-expanded .clients__list .clients__more .btn-more__glow{display:none !important}
}

/* (5) Vybrané odstavce zarovnat DO BLOKU (justify) s automatickým dělením
   slov (lang=cs) – čisté zarovnání bez velkých mezer. */
.hero__sub,
#sluzby .lead,
.svc__item p,
#bezpecnost .lead,
#o-nas .split__content > p,
#cenik p{
  text-align:justify !important;
  -webkit-hyphens:auto !important;
  -ms-hyphens:auto !important;
  hyphens:auto !important;
}

/* =====================================================================
   MOBIL – PRÉMIOVÉ REFERENČNÍ KARTY (oprava překryvů, čitelnost)
   Příčina: dřívější pravidlo přepsalo pravé odsazení summary na 20 px,
   takže název i „(a.s.)" běžely POD kruhovou šipku. Chip se navíc mačkal
   s názvem. Řešení: štítek i název na vlastní řádky, šipka svisle
   vycentrovaná s dostatečným místem, nikdy nekoliduje.
   ===================================================================== */
@media (max-width:600px){
  /* dost místa vpravo pro ovládací šipku + vzdušnější karta */
  .client > summary{
    padding:18px 60px 15px 20px !important;
    display:block !important;
  }
  .client__detail{ padding:0 20px 20px !important }

  /* sektorový chip: kompaktní pilulka na vlastním řádku NAD názvem */
  .client > summary::before{
    display:block !important; width:max-content !important; max-width:100% !important;
    margin:0 0 10px 0 !important; white-space:nowrap !important;
  }

  /* název reference: čitelná velikost, plná šířka pod chipem
     (přepínání .cn-m/.cn-d ponecháno beze změny – žádná duplicita názvu) */
  .client .cn-d,.client .cn-m{
    font-size:18px !important; line-height:1.28 !important;
  }
  .client > summary .clients__lf{ white-space:nowrap !important }

  /* ovládací šipka: svisle vycentrovaná, jasně viditelná, bezpečně uvnitř karty.
     Ikona je vlastní, plně zakódovaný SVG (nezávislý na základním pravidle),
     aby se spolehlivě vykreslila i ve vestavěných prohlížečích. */
  .client > summary::after{
    display:block !important; content:"" !important; position:absolute !important;
    top:50% !important; right:16px !important; margin:0 !important;
    transform:translateY(-50%) !important;
    width:34px !important; height:34px !important; border-radius:50% !important;
    border:1.6px solid rgba(27,86,136,.42) !important;
    background-color:rgba(27,86,136,.06) !important;
    background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%231B5688'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M6%209l6%206%206-6'/%3E%3C/svg%3E") !important;
    background-repeat:no-repeat !important;
    background-position:center !important;
    background-size:15px !important;
  }
  .client[open] > summary::after{
    transform:translateY(-50%) rotate(180deg) !important;
    border-color:#1B5688 !important; background-color:rgba(27,86,136,.12) !important;
  }
}

/* =====================================================================
   OPRAVA: „Zobrazit více realizací" nereagovalo.
   Příčina: .client{display:flex !important} přebíjelo .client--extra{display:none}
   (bez !important) → extra reference 09–15 byly fakticky stále zobrazené a
   tlačítko nemělo co odkrýt. Obnoveno progresivní odkrytí:
   • ve výchozím stavu jsou reference 09–15 skryté,
   • po kliknutí na „Zobrazit více realizací" se zobrazí,
   • na mobilu JS navíc automaticky otevře kartu 09 (Elektrárna Dětmarovice).
   Čistě CSS; funkčnost JavaScriptu zůstává nedotčena.
   ===================================================================== */
.client--extra{display:none !important}
.clients.is-expanded .client--extra{display:flex !important; animation:clientReveal .5s var(--ease) both}
@media (prefers-reduced-motion:reduce){
  .clients.is-expanded .client--extra{animation:none !important}
}

/* =====================================================================
   HERO – ZVÝRAZNĚNÍ DOMINANTY (kostelní věž Tábora) + PRÉMIOVÉ LOGO
   Čistě vizuální, aditivní.
   ===================================================================== */

/* (A) Jemné prosvětlení fotky, aby věž vynikla (mírně po celém webu) */
.hero__bg{ filter:brightness(1.22) contrast(1.05) saturate(1.12) sepia(.08) !important }

/* (B) DESKTOP (≥1025) – věž vlevo prosvětlená + „reflektor“ na věž,
   ztmavení až vpravo za textem (čitelnost). Přebíjí globální překryv,
   který dosud věž zbytečně ztmavoval. */
@media (min-width:1025px){
  .hero__overlay{
    background:
      radial-gradient(56% 66% at 31% 40%, rgba(150,190,232,.16), rgba(150,190,232,0) 60%),
      linear-gradient(to right,
        rgba(11,18,30,.04) 0%, rgba(11,18,30,.02) 30%,
        rgba(11,18,30,.26) 46%, rgba(11,18,30,.60) 60%, rgba(11,18,30,.87) 100%),
      linear-gradient(180deg,
        rgba(11,18,30,.10) 0%, rgba(11,18,30,0) 42%, rgba(11,18,30,.34) 100%)
    !important;
  }
}

/* (C) LOGO v hlavičce – prémiová ČERNÁ (ladí s černým nápisem), bílý horolezec. */
.logo img{
  filter:grayscale(1) brightness(.84) contrast(1.55)
         drop-shadow(0 2px 6px rgba(16,24,40,.16)) !important;
}

/* =====================================================================
   HERO – VÝRAZNĚJŠÍ PROKLIK NA REFERENCE (nejdůležitější část webu)
   Z nenápadného průhledného panelu -> plné, kontrastní, jednoznačně
   klikatelné CTA s jemným pulzem a čitelnou šipkou.
   (Prvek se zobrazuje na desktopu ≥1025; níže se na reference odkazuje jinak.)
   ===================================================================== */
@media (min-width:1025px){
  .ref-jump--hero{
    background:linear-gradient(180deg,#2A74AE 0%,#154268 100%) !important;
    -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
    border:1px solid rgba(255,255,255,.22) !important;
    border-left:1px solid rgba(255,255,255,.22) !important;
    border-radius:12px !important;
    padding:15px 26px !important;
    box-shadow:0 14px 34px rgba(11,18,30,.5),
               inset 0 1px 0 rgba(255,255,255,.22),
               0 0 0 0 rgba(140,192,236,.5) !important;
    animation:refJumpGlow 2.6s ease-in-out infinite !important;
  }
  .ref-jump--hero .ref-jump__label{
    color:#ffffff !important; font-size:16px !important; letter-spacing:.6px !important;
  }
  .ref-jump--hero .ref-jump__hint{ color:#d7e6f6 !important; font-size:12.5px !important }
  .ref-jump--hero .ref-jump__hint::before{ color:#9fd0f5 !important }
  .ref-jump--hero .ref-jump__chev{
    color:#ffffff !important; width:24px !important; height:24px !important; margin-left:12px !important;
  }
  .ref-jump--hero:hover, .ref-jump--hero:focus-visible{
    background:linear-gradient(180deg,#3383C0 0%,#173F62 100%) !important;
    transform:translateY(-3px) !important;
    border-color:rgba(255,255,255,.34) !important;
    box-shadow:0 22px 46px rgba(27,86,136,.55),
               inset 0 1px 0 rgba(255,255,255,.26) !important;
    animation:none !important;
  }
}
/* jemný „radar" pulz vybízející ke kliknutí (rozšiřující se mizející prstenec) */
@keyframes refJumpGlow{
  0%,100%{ box-shadow:0 14px 34px rgba(11,18,30,.5),
            inset 0 1px 0 rgba(255,255,255,.22),
            0 0 0 0 rgba(140,192,236,.5) }
  50%{ box-shadow:0 14px 34px rgba(11,18,30,.5),
            inset 0 1px 0 rgba(255,255,255,.22),
            0 0 0 9px rgba(140,192,236,0) }
}
@media (prefers-reduced-motion:reduce){
  .ref-jump--hero{ animation:none !important }
}

/* =====================================================================
   GALERIE SLUŽEB – ODLEHČENÍ RÁMU (čistý, prémiový, „editorial“ vzhled)
   Pryč s těžkým tmavým rámem/matnou; fotka je nyní od kraje ke kraji,
   jemně zaoblená, s decentním vnitřním lemem a měkkým vrstveným stínem.
   ===================================================================== */
.svc__gallery{
  padding:0 !important;
  background:#0c1320 !important;
  border-radius:16px !important;
  box-shadow:0 1px 2px rgba(11,18,30,.10),
             0 24px 50px -18px rgba(11,18,30,.32) !important;
}
.svc__gallery::before{ display:none !important }
.svc__stage{
  border-radius:16px !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10) !important;
}
.svc__slide{ border-radius:16px !important }
.svc__stage::after{
  border-radius:16px !important;
  background:linear-gradient(180deg,transparent 70%,rgba(8,13,22,.20)) !important;
}
.svc__nav--prev{ left:14px !important }
.svc__nav--next{ right:14px !important }
.svc__dots{ bottom:16px !important }
@media (max-width:560px){
  .svc__gallery{ border-radius:14px !important }
  .svc__stage,.svc__slide,.svc__stage::after{ border-radius:14px !important }
}

/* =====================================================================
   BEZPEČNOST – nová fotka (panorama Tábora): jemné sladění s vizuálem webu
   (decentní úprava, aby zapadla do chladně-prémiového tónu, ale zůstala
   živá; navazuje na modré rohové značky a rám .split__media).
   ===================================================================== */
#bezpecnost .split__media{
  filter:contrast(1.03) brightness(1.05);
}

/* =====================================================================
   HODNOCENÍ ZÁKAZNÍKŮ – viditelné stránkovací tečky
   Neaktivní tečky byly bílé (rgba(255,255,255,.22)) na SVĚTLÉM pozadí,
   tedy prakticky neviditelné. Přebarveno do firemní modré.
   ===================================================================== */
.revslider__dots button{
  background:rgba(27,86,136,.30) !important;
  box-shadow:0 0 0 1px rgba(27,86,136,.12) !important;
}
.revslider__dots button:hover{ background:rgba(27,86,136,.55) !important }
.revslider__dots button.is-on{ background:#1B5688 !important; box-shadow:none !important }

/* =====================================================================
   O SPOLEČNOSTI – jediná fotka (instruktor na černém pozadí), bez střídání,
   na PC výrazně větší (dosud limit 340 px).
   ===================================================================== */
/* zrušit střídání: logo skryté, fotka instruktora vždy viditelná */
.onas-rot__img--b{ display:none !important }
.onas-rot .onas-rot__img--a,
.onas-rot.is-b .onas-rot__img--a{ opacity:1 !important; transform:none !important }
#o-nas .instructor-photo{ cursor:default !important }
/* PC – větší fotka */
@media (min-width:1025px){
  #o-nas .split__media.instructor-photo{ max-width:500px !important }
}
@media (min-width:681px) and (max-width:1024px){
  #o-nas .split__media.instructor-photo{ max-width:380px !important }
}

/* =====================================================================
   REALIZACE – (1) PC: tlačítko „Zobrazit více" do volné buňky vedle
   poslední karty (zvětšené na kartu), (2) čitelnější a prémiovější sekce.
   ===================================================================== */

/* (1) SBALENÝ stav na PC: tlačítko padne do volné buňky mřížky vedle poslední
   karty a zvětší se na plnohodnotnou kartu – žádné plýtvání prostorem. */
@media (min-width:1025px){
  .clients:not(.is-expanded) .clients__list .clients__more{
    grid-column:auto !important; align-self:stretch !important; margin-top:0 !important;
  }
  .clients:not(.is-expanded) .clients__list .clients__more .btn-more{
    width:100% !important; height:100% !important; min-height:190px !important;
    flex-direction:column-reverse !important; justify-content:center !important; align-items:center !important; gap:18px !important;
    padding:30px 26px !important; border-radius:16px !important;
    background:linear-gradient(158deg,#ffffff 0%,#f6f8fb 100%) !important;
    border:1.5px solid #d3dbe4 !important;
    box-shadow:0 1px 2px rgba(16,24,40,.05),0 16px 34px rgba(16,24,40,.07) !important;
    letter-spacing:1.6px !important;
  }
  .clients:not(.is-expanded) .clients__list .clients__more .btn-more:hover{
    transform:translateY(-4px) !important; border-color:#1B5688 !important;
    background:linear-gradient(158deg,#ffffff 0%,#eef4fa 100%) !important;
    box-shadow:0 12px 22px rgba(16,24,40,.09),0 30px 60px rgba(27,86,136,.16) !important;
  }
  .clients:not(.is-expanded) .clients__list .clients__more .btn-more__chev{
    width:54px !important; height:54px !important; padding:15px !important;
    border-radius:50% !important; border:1.6px solid rgba(27,86,136,.4) !important;
    background:rgba(27,86,136,.08) !important; color:#1B5688 !important;
    transition:transform .3s var(--ease),background .25s ease,border-color .25s ease !important;
  }
  .clients:not(.is-expanded) .clients__list .clients__more .btn-more:hover .btn-more__chev{
    background:rgba(27,86,136,.14) !important; border-color:#1B5688 !important; transform:translateY(3px) !important;
  }
  .clients:not(.is-expanded) .clients__list .clients__more .btn-more__label{
    color:#16202E !important; font-size:15px !important; font-weight:600 !important;
  }
  .clients:not(.is-expanded) .clients__list .clients__more .btn-more__glow{display:none !important}
}

/* (2) ČITELNOST + PRÉMIOVOST sekce „Vybraní zákazníci a realizace" */
/* tmavší, lépe čitelný text karet */
.client__detail p{ color:#384049 !important }
.client__detail p.client__spec{ color:#545e6a !important }
.client .cn-d,.client .cn-m{ color:#141d2b !important }
/* výraznější (dosud skoro neviditelný) horní akcent běžných karet */
.client:not(.client--featured)::after{ background:linear-gradient(90deg,#a7b8cb,#dae1e9) !important }
/* silnější přítomnost bílých karet na světlé sekci */
.clients__list .client:not(.client--featured){
  box-shadow:0 1px 2px rgba(16,24,40,.05),0 18px 42px rgba(16,24,40,.09) !important;
}
/* výraznější nadpis sekce */
#realizace .clients__label{ color:#0f1a2b !important }

/* =====================================================================
   MOBILNÍ HERO – text mimo věž, do volného tmavého prostoru NAHOŘE
   Věž (dominanta) je vlevo/uprostřed a nejsvětlejší dole; text dosud
   seděl dole PŘES věž (špatná čitelnost). Přesunuto nahoru na tmavé nebe,
   s horním scrimem pro čitelnost; spodek projasněn, aby vynikla věž.
   ===================================================================== */
@media (max-width:680px){
  .hero{ align-items:flex-start !important; }
  .hero__inner{ padding:24px 22px 40px !important; }
  .hero__overlay{
    background:
      linear-gradient(180deg,
        rgba(8,13,22,.80) 0%, rgba(8,13,22,.62) 20%, rgba(8,13,22,.34) 38%,
        rgba(8,13,22,.10) 54%, rgba(8,13,22,0) 70%),
      linear-gradient(180deg, transparent 64%, rgba(8,13,22,.30) 100%)
    !important;
  }
  /* silnější stín textu pro jistou čitelnost nad fotkou */
  .hero h1{ text-shadow:0 3px 20px rgba(0,0,0,.7),0 1px 2px rgba(0,0,0,.5) !important }
  .hero__sub{ text-shadow:0 2px 12px rgba(0,0,0,.65) !important; color:#e6ebf1 !important }
  .hero .eyebrow{ text-shadow:0 2px 10px rgba(0,0,0,.6) !important }
}

/* =====================================================================
   HERO – PC: textový box vystředěný ve volném prostoru vedle věže
   (dosud byl nalepený na věž; na širokých monitorech dokonce více vlevo).
   Střed boxu = 70 vw (střed volného nebe vedle věže vlevo).
   ===================================================================== */
@media (min-width:1025px){
  .hero__inner{
    max-width:min(540px,42vw) !important;
    margin-left:calc(70vw - min(270px,21vw)) !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:clamp(16px,2vw,32px) !important;
  }
}

/* =====================================================================
   UPOZORŇOVACÍ LIŠTA pod headerem (blog vs. oficiální web)
   ===================================================================== */
.sitenotice{ background:#eef2f6; border-bottom:1px solid #dfe4ea; }
.sitenotice__inner{
  padding:9px 20px; font-size:13px; line-height:1.5;
  color:#4a5560; text-align:center;
}
.sitenotice strong{ color:#2a3542; font-weight:700; }
.sitenotice a{
  color:#1B5688; font-weight:700; text-decoration:none; white-space:nowrap;
  transition:color .2s ease;
}
.sitenotice a:hover{ text-decoration:underline; color:#134266; }
@media (max-width:600px){
  .sitenotice__inner{ font-size:12px; padding:8px 16px; }
  .sitenotice a{ white-space:normal; }
}

/* Odkaz na konkrétní zakázku v hodnocení (na tmavé kartě) */
.revslide__meta a{
  color:#9fd0f5; text-decoration:none;
  border-bottom:1px solid rgba(159,208,245,.35);
  transition:color .2s ease,border-color .2s ease;
}
.revslide__meta a:hover{ color:#d7ecfb; border-bottom-color:#9fd0f5; }

/* =====================================================================
   HLAVIČKA – PRÉMIOVÁ MODERNIZACE (desktop + mobil) + sticky na PC
   ===================================================================== */

/* (4) PC/laptop/tablet: hlavička se NIKDY neschová – jen zúží (sticky). */
@media (min-width:769px){
  .header{ position:sticky !important; top:0 !important; }
}

/* (2) Desktop „bílá lišta" – frosted glass, jemná linka, prémiový stín. */
@media (min-width:769px){
  .header{
    background:rgba(255,255,255,.86) !important;
    -webkit-backdrop-filter:saturate(1.15) blur(14px) !important;
    backdrop-filter:saturate(1.15) blur(14px) !important;
    border-bottom:1px solid rgba(16,24,40,.07) !important;
    box-shadow:0 1px 0 rgba(16,24,40,.03),0 10px 30px -14px rgba(16,24,40,.14) !important;
  }
  .header.header--compact{
    background:rgba(255,255,255,.92) !important;
    box-shadow:0 1px 0 rgba(16,24,40,.05),0 14px 34px -14px rgba(16,24,40,.2) !important;
  }
  /* wordmark */
  .logo__text strong{ letter-spacing:.4px !important; }
  .logo__text span{ color:#6a7480 !important; letter-spacing:.3px !important; }

  /* nav – čistší, prémiovější: bez „pipe" oddělovačů, jemný accent hover */
  .nav{ gap:clamp(16px,1.6vw,26px) !important; }
  .nav a:not(:first-child)::before{ display:none !important; }   /* pryč s oddělovači */
  .nav a{
    color:#2a3542 !important; font-weight:600 !important; letter-spacing:.8px !important;
    transition:color .2s ease !important;
  }
  .nav a:hover{ color:#1B5688 !important; }
  .nav a::after{ background:#1B5688 !important; height:2px !important; }
  .nav__ico{ opacity:.7 !important; transition:opacity .2s ease,transform .2s ease !important; }
  .nav a:hover .nav__ico{ opacity:1 !important; color:#1B5688 !important; }

  /* prémiové telefonní tlačítko v hlavičce */
  .header .btn--phone-sm{
    border-radius:10px !important; letter-spacing:.6px !important;
    box-shadow:0 6px 16px -6px rgba(27,86,136,.5) !important;
  }
}

/* (3) MOBIL – prémiový hamburger: jemnější ikona + animace na „X" ------ */
@media (max-width:1024px){
  /* jednotné menu = hamburger; tří-tečkové menu skryto (dřív duplicita) */
  .dotnav{ display:none !important; }

  .nav-toggle{
    display:flex !important; width:44px; height:44px; padding:0 !important;
    align-items:center; justify-content:center; gap:0 !important;
    border-radius:12px; background:rgba(16,24,40,.04);
    border:1px solid rgba(16,24,40,.08);
    transition:background .2s ease,border-color .2s ease;
    position:relative;
  }
  .nav-toggle:hover{ background:rgba(27,86,136,.08); border-color:rgba(27,86,136,.22); }
  .nav-toggle span{
    position:absolute; left:11px; right:11px; top:50%; width:auto !important; height:2px !important;
    background:#16202e !important; border-radius:2px;
    transition:transform .28s cubic-bezier(.22,.61,.36,1),opacity .2s ease;
  }
  .nav-toggle span:nth-child(1){ transform:translateY(-7px); }
  .nav-toggle span:nth-child(2){ transform:translateY(-1px); }
  .nav-toggle span:nth-child(3){ transform:translateY(5px); }
  .nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(-1px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-1px) rotate(-45deg); }

  /* prémiový rozbalovací panel navigace */
  .header .nav{
    background:#ffffff !important;
    border-top:1px solid rgba(16,24,40,.07) !important;
    box-shadow:0 22px 40px -12px rgba(16,24,40,.22) !important;
    padding:10px 14px 14px !important; gap:2px !important;
    border-radius:0 0 16px 16px !important;
  }
  .header .nav a{
    display:flex !important; align-items:center !important; gap:12px !important;
    padding:13px 14px !important; border-radius:10px !important;
    color:#1c2530 !important; font-size:15px !important; letter-spacing:.6px !important;
    border-bottom:1px solid rgba(16,24,40,.05) !important;
    transition:background .18s ease,color .18s ease !important;
  }
  .header .nav a:last-child{ border-bottom:0 !important; }
  .header .nav a:hover,.header .nav a:active{
    background:rgba(27,86,136,.07) !important; color:#1B5688 !important;
  }
  .header .nav a::after{ display:none !important; }        /* v panelu bez podtržítka */
  .header .nav a::before{ display:none !important; }        /* bez oddělovačů */
  .header .nav .nav__ico{
    display:inline-flex !important; width:19px !important; height:19px !important;
    opacity:.85 !important; color:#1B5688 !important; flex:none !important;
  }
}

/* =====================================================================
   MOBIL + TABLET (≤1024) – HERO: text NAHOŘE, výrazné CTA DOLE.
   Hero se vejde POD header + upozorňovací lištu, aby bylo CTA vždy vidět
   na úvodní obrazovce bez scrollování. Text má horní scrim pro čitelnost,
   věž (dominanta) zůstává uprostřed/dole. (Přepisuje starší rozložení,
   kde text seděl dole přes věž.)
   ===================================================================== */
@media (max-width:1024px){
  .hero{
    min-height:calc(100vh - 144px) !important;
    min-height:calc(100svh - 144px) !important;
    align-items:stretch !important;
  }
  .hero__inner{
    display:flex !important; flex-direction:column !important;
    justify-content:flex-start !important;
    min-height:calc(100vh - 144px) !important;
    min-height:calc(100svh - 144px) !important;
    padding:clamp(16px,4vw,30px) clamp(20px,5vw,34px)
            calc(clamp(18px,4.5vw,30px) + env(safe-area-inset-bottom)) !important;
  }

  /* horní scrim za textem, střed čistý (věž), jemné ztmavení dole pod CTA */
  .hero__overlay{
    background:linear-gradient(180deg,
      rgba(8,13,22,.85) 0%, rgba(8,13,22,.62) 15%, rgba(8,13,22,.32) 30%,
      rgba(8,13,22,.08) 44%, rgba(8,13,22,0) 58%,
      rgba(8,13,22,0) 70%, rgba(8,13,22,.55) 100%) !important;
  }

  /* TEXT nahoře */
  .hero .eyebrow{ margin-top:0 !important; margin-bottom:14px !important;
    text-shadow:0 2px 10px rgba(0,0,0,.6) !important; }
  .hero h1{ margin:0 !important;
    text-shadow:0 3px 20px rgba(0,0,0,.7),0 1px 2px rgba(0,0,0,.5) !important; }

  /* CTA dole – vždy viditelné, prémiové, přes celou šířku */
  .hero__cta{
    margin-top:auto !important; margin-bottom:0 !important; padding-top:20px !important;
    flex-direction:column !important; align-items:stretch !important;
    flex-wrap:nowrap !important; gap:12px !important; width:100% !important;
  }
  .hero__profile{ margin-top:0 !important; margin-bottom:2px !important; padding-bottom:2px !important; }
  .hero__cta .btn--primary,.hero__cta .btn--call{
    width:100% !important; max-width:none !important; justify-content:center !important;
  }

  /* scroll cue pryč (CTA je nyní dole) */
  .hero::after{ display:none !important; }
}

/* upozorňovací lišta – kompaktnější na mobilu (menší výška = víc místa pro hero) */
@media (max-width:600px){
  .sitenotice__inner{ font-size:11.5px !important; padding:6px 14px !important; line-height:1.38 !important; }
}

/* =====================================================================
   OPRAVA: slovo „horolezeckou" se nesmí lámat uprostřed (HOROLEZECKO / U).
   Celá slova se lámou jen mezi sebou; na desktopu mark dědil obří velikost
   h1 a v zúženém textovém boxu se dlouhé slovo lámalo uprostřed – zmenšíme
   ho na velikost, která se na řádek vejde (bez přetečení).
   ===================================================================== */
.hero__mark{
  overflow-wrap:normal !important;
  word-break:keep-all !important;
  hyphens:none !important;
}
@media (min-width:1025px){
  .hero__mark{ font-size:clamp(34px,5vw,60px) !important; line-height:1.06 !important; }
}

/* Lišta: každá věta na samostatném řádku (mobil + tablet) */
@media (max-width:1024px){
  .sitenotice__inner .sn-line{ display:block; }
}

/* MOBIL/TABLET (≤1024) HERO: text zarovnaný VLEVO NAHOŘE (obtéká věž),
   pod textem pobídka ke scrollování. CTA zůstává dole (viditelné). */
@media (max-width:1024px){
  .hero__inner{ text-align:left !important; align-items:flex-start !important; }
  .hero .eyebrow,.hero h1,.hero__mark{ text-align:left !important; }
  .hero__cta{ align-items:stretch !important; }

  /* pobídka ke scrollování hned pod textem (ne přes celý hero) */
  .hero__inner::after{
    content:""; display:block; width:20px; height:20px; margin:22px 0 0 4px;
    border-right:2.4px solid rgba(255,255,255,.85);
    border-bottom:2.4px solid rgba(255,255,255,.85);
    transform:rotate(45deg);
    animation:heroScrollCue 1.9s ease-in-out infinite;
    opacity:.9; flex:none;
  }
  .hero::after{ display:none !important; }   /* stará šipka uprostřed dole pryč */
}

/* =====================================================================
   MOBIL/TABLET (≤1024) – text do PRAVÉHO HORNÍHO rohu (obtéká věž vlevo),
   scroll pobídka NAD CTA na tmavém podkladu. (Přepisuje předchozí levé
   zarovnání i pobídku pod tlačítkem.)
   ===================================================================== */
@media (max-width:1024px){
  .hero__inner{ align-items:flex-end !important; text-align:right !important; }
  .hero .eyebrow,.hero h1,.hero__mark{ text-align:right !important; }
  .hero .eyebrow{ padding-left:0 !important; margin-left:auto !important; }
  .hero .eyebrow::before{ display:none !important; }   /* levá linka u pravého zarovnání ruší */
  .hero h1{ max-width:62% !important; margin-left:auto !important; }

  /* CTA zůstává přes celou šířku dole */
  .hero__cta{ align-self:stretch !important; width:100% !important; }

  /* scroll pobídka: NAD CTA, posunutá vpravo (ladí s textem vpravo), tmavý podklad + stín */
  .hero__inner::after{
    content:"" !important; position:absolute !important;
    left:auto !important; right:clamp(30px,16vw,84px) !important; top:auto !important; bottom:100px !important;
    width:22px !important; height:22px !important; margin:0 !important;
    border-right:2.6px solid #fff !important; border-bottom:2.6px solid #fff !important;
    border-top:0 !important; border-left:0 !important;
    transform:rotate(45deg) !important;
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.75)) !important;
    animation:heroScrollCueR 1.9s ease-in-out infinite !important;
    opacity:.95 !important;
  }
  .hero::after{ display:none !important; }
}
@keyframes heroScrollCueR{
  0%,100%{transform:rotate(45deg) translate(0,0); opacity:.5}
  50%{transform:rotate(45deg) translate(3px,3px); opacity:1}
}

/* O společnosti – pozadí slotu sladěné s navy pozadím loga (bez viditelného švu) */
#o-nas .split__media.instructor-photo{ background-color:#0a1321 !important; }

/* =====================================================================
   MOBILNÍ POBÍDKOVÝ PÁS k referencím (mezi hero/službami) – jen ≤1024.
   Prémiový šedý pás s textovou výzvou (bez tlačítka).
   ===================================================================== */
.leadband{ display:none; }
@media (max-width:1024px){
  .leadband{
    display:flex; align-items:center; gap:16px;
    padding:18px clamp(18px,5vw,28px);
    background:linear-gradient(180deg,#eef1f5 0%,#e5e9ef 100%);
    border-top:1px solid #dce1e8; border-bottom:1px solid #d4dae2;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
    text-decoration:none; color:#16202e;
    transition:background .2s ease;
  }
  .leadband:hover,.leadband:active{ background:linear-gradient(180deg,#e9edf2 0%,#dee3ea 100%); }
  .leadband__text{ flex:1 1 auto; min-width:0; }
  .leadband__eyebrow{
    display:block; font-family:'Oswald',sans-serif; font-size:11px; font-weight:600;
    letter-spacing:2.2px; text-transform:uppercase; color:#1B5688; margin-bottom:5px;
  }
  .leadband__title{
    display:block; font-family:'Oswald',sans-serif; font-weight:600;
    font-size:clamp(15.5px,4.4vw,19px); line-height:1.28; color:#17222f;
  }
  .leadband__cue{
    flex:none; width:40px; height:40px; border-radius:50%;
    display:grid; place-items:center;
    background:#1B5688; color:#fff; font-size:20px; font-weight:700; line-height:1;
    box-shadow:0 6px 16px -6px rgba(27,86,136,.6);
    transition:transform .2s ease;
  }
  .leadband:hover .leadband__cue,.leadband:active .leadband__cue{ transform:translateX(3px); }
}

/* =====================================================================
   OPRAVA: křížek (zavření) u rozklikávacích referencí na mobilu/tabletu.
   Původní „+/×" byl kreslený gradientovými čárami v pozadí – v některých
   prohlížečích se nevykreslil (prázdné kolečko). Nahrazeno spolehlivým
   textovým znakem „+" (zavřeno) → „×" (otevřeno).
   Jen ≤600 px – tam jsou karty rozklikávací (výš je indikátor skrytý).
   ===================================================================== */
@media (max-width:600px){
  .client > summary::after{
    content:"+" !important;
    display:grid !important; place-items:center !important;
    background-image:none !important;
    width:28px !important; height:28px !important;
    border:1.8px solid #1B5688 !important;
    background-color:#ffffff !important;
    font-family:'Oswald',sans-serif !important; font-weight:600 !important;
    font-size:24px !important; line-height:1 !important;
    color:#1B5688 !important;
    transform:none !important; opacity:1 !important;
  }
  .client[open] > summary::after{
    content:"×" !important;
    transform:none !important;
    border-color:#1B5688 !important;
    background-color:#1B5688 !important;
    color:#ffffff !important;
    background-image:none !important;
  }
}

/* Zkrácení popisku hodnocení na mobilu (skryje " v BD") */
@media (max-width:600px){ .hide-sm{ display:none !important; } }

/* =====================================================================
   ÚKOL 1 – PC/velká zobrazení: hlavička (menu) sticky po celou dobu,
   odjíždí jen šedá lišta (sitenotice). Příčina dřívějšího odjíždění
   menu byl `overflow-x:hidden` na body/html, který ruší position:sticky.
   `overflow-x:clip` ořízne stejně, ale sticky funguje.
   ===================================================================== */
@media (min-width:769px){
  html, body{ overflow-x:clip !important; }
}

/* =====================================================================
   ÚKOL 2 – DESKTOP (≥1025) prémiové scroll tlačítko: microlabel + dráha
   s putující tečkou + šipka. Vystředěné dole nad tmavým nebem (vyvážené,
   čitelné). Klikací (dotyk i myš) → plynulý sjezd na obsah. Respektuje
   prefers-reduced-motion.
   ===================================================================== */
.hero__scrolldown{ display:none; }
@media (min-width:1025px){
  .hero__sub{ position:relative; }
  .hero__scrolldown{
    display:flex; flex-direction:column; align-items:center; gap:11px;
    position:absolute; top:0; right:0; left:auto; bottom:auto; transform:translateY(-50%);
    z-index:6; text-decoration:none; cursor:pointer;
    padding:6px 10px; border-radius:0;
    background:none;
    transition:transform .3s ease, opacity .3s ease; opacity:.92;
  }
  .hero__scrolldown:hover,.hero__scrolldown:focus-visible{ opacity:1; transform:translateY(calc(-50% + 3px)); }
  .hero__scrolldown:focus-visible{ outline:none; }
  .hero__scrolldown:focus-visible .hero__scrolldown__label{ color:#9FD0F5; }
  .hero__scrolldown__label{
    font-family:'Oswald',sans-serif; font-size:11px; font-weight:600; letter-spacing:3.2px;
    text-transform:uppercase; color:rgba(255,255,255,.9); text-shadow:0 1px 6px rgba(0,0,0,.6);
    transition:color .3s ease;
  }
  .hero__scrolldown__label::after{ content:"Prozkoumat"; }
  .hero__scrolldown__track{
    position:relative; width:1.5px; height:34px; border-radius:2px; overflow:hidden;
    background:linear-gradient(rgba(159,208,244,.5),rgba(159,208,244,.04));
  }
  .hero__scrolldown__dot{
    position:absolute; left:50%; top:2px; width:5px; height:5px; border-radius:50%;
    background:#9FD0F5; box-shadow:0 0 10px rgba(159,208,244,.95);
    transform:translateX(-50%);
    animation:heroScrollDot 2.1s cubic-bezier(.66,0,.34,1) infinite;
  }
  .hero__scrolldown__chev{
    width:11px; height:11px; margin-top:-4px;
    border-right:2px solid rgba(159,208,244,.92); border-bottom:2px solid rgba(159,208,244,.92);
    transform:rotate(45deg); filter:drop-shadow(0 1px 4px rgba(0,0,0,.5));
    animation:heroScrollChev 2.1s ease-in-out infinite;
  }
}
@keyframes heroScrollDot{
  0%{ transform:translateX(-50%) translateY(0); opacity:0 }
  16%{ opacity:1 }
  80%{ opacity:1 }
  100%{ transform:translateX(-50%) translateY(28px); opacity:0 }
}
@keyframes heroScrollChev{
  0%,100%{ transform:rotate(45deg) translate(0,0); opacity:.55 }
  50%{ transform:rotate(45deg) translate(2px,2px); opacity:1 }
}
@media (prefers-reduced-motion:reduce){
  .hero__scrolldown__dot,.hero__scrolldown__chev{ animation:none !important; }
  .hero__scrolldown__dot{ top:auto; bottom:4px; opacity:.9; }
}

/* =====================================================================
   MOBIL (≤768) – hlavička sticky + plynulé ZMENŠENÍ při scrollu (compact).
   Zúžená bílá lišta (logo, název, hamburger) zůstává viditelná pořád –
   menu je vždy po ruce. Šedý blog pás odjede nahoru pod bílou lištu.
   ===================================================================== */
@media (max-width:768px){
  .nav-toggle{ transition:padding .3s ease; }
  .nav-toggle span{ transition:width .3s ease, height .3s ease; }

  .header.header--compact .header__inner{ min-height:46px !important; padding-top:4px !important; padding-bottom:4px !important; }
  .header.header--compact .logo img{ height:32px !important; width:auto !important; }
  .header.header--compact .logo__text strong{ font-size:11.5px !important; letter-spacing:.2px !important; }
  .header.header--compact .nav-toggle{ padding:6px 5px !important; }
  .header.header--compact .nav-toggle span{ width:21px !important; height:2.5px !important; }
}

/* Pobídka k referencím – kratší titulek vždy na JEDEN řádek */
@media (max-width:1024px){
  .leadband__title{ white-space:nowrap !important; font-size:clamp(12px,3.5vw,18px) !important; }
}

/* Eyebrow „Chotoviny • Tábor • celá ČR" – vedlejší slova zesvětlená (Tábor vynikne) */
.hero .eyebrow .eb-dim{ color:#bcd6f0 !important; opacity:.6 !important; font-weight:500 !important; }

/* =====================================================================
   REKLAMNÍ SLOT v patičce (placené sdělení) – FB skupina práce/brigády.
   Zřetelně označeno štítkem „Reklama"; odkaz označen rel="sponsored".
   Na tmavé patičce světlý text + modré FB tlačítko.
   ===================================================================== */
.adslot{ border-top:1px solid rgba(255,255,255,.08); margin-top:44px; background:rgba(255,255,255,.02); }
.adslot__inner{ display:flex; align-items:center; justify-content:center; gap:12px 22px; padding:20px 24px; flex-wrap:wrap; }
.adslot__tag{
  font-family:'Oswald',sans-serif; font-size:10px; font-weight:600; letter-spacing:2px; text-transform:uppercase;
  color:#9aa3ad; border:1px solid rgba(255,255,255,.22); border-radius:4px; padding:3px 8px; white-space:nowrap;
  align-self:center;
}
.adslot__text{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.adslot__title{ font-family:'Oswald',sans-serif; font-weight:600; font-size:15.5px; letter-spacing:.4px; color:#e8ecf1; line-height:1.25; }
.adslot__desc{ font-size:12px; color:#98a1ab; letter-spacing:.2px; line-height:1.4; }
.adslot__cta{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  font-family:'Oswald',sans-serif; font-weight:600; font-size:13.5px; letter-spacing:.6px; text-transform:uppercase;
  color:#fff; background:#1877F2; padding:10px 16px; border-radius:8px; text-decoration:none;
  box-shadow:0 8px 20px -10px rgba(24,119,242,.7);
  transition:background .2s ease, transform .2s ease;
}
.adslot__cta:hover,.adslot__cta:focus-visible{ background:#0f63d6; transform:translateY(-1px); color:#fff; }
.adslot__fb{ flex:none; }
@media (max-width:600px){
  .adslot__inner{ gap:12px 16px; padding:18px 18px; }
  .adslot__cta{ width:100%; justify-content:center; }
}

/* spodní řádek patičky – nyní jeden sloučený text → vystředit */
.footer__bottom-inner{ justify-content:center !important; text-align:center; }

/* =====================================================================
   TRUST STRIP pod hlavičkou – PC/větší zobrazení (≥769): vyšší, prémiový,
   čitelný. Jemný světlý gradient, modrý horní accent, výraznější a tmavší
   text, jemné oddělovače, hover.
   ===================================================================== */
@media (min-width:769px){
  .strip{
    background:linear-gradient(180deg,#f7f9fb 0%,#eceff4 100%) !important;
    border-top:3px solid #1B5688 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 8px 20px -14px rgba(16,24,40,.2) !important;
    padding:0 !important;
  }
  .strip__inner{ gap:0 !important; align-items:stretch !important; }
  .strip__inner span{
    flex:1 !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
    padding:28px 16px !important;
    border-left:1px solid #e2e6ec !important;
    font-family:'Oswald',sans-serif !important; font-weight:600 !important;
    font-size:15px !important; letter-spacing:1.8px !important; text-transform:uppercase !important;
    color:#1e2a38 !important; line-height:1.2 !important;
    transition:color .2s ease, background .2s ease !important;
  }
  .strip__inner span:first-child{ border-left:none !important; }
  .strip__inner span::before{
    content:"▲" !important; position:static !important; display:inline-block !important;
    color:#1B5688 !important; font-size:9px !important; margin-right:11px !important;
    transform:translateY(-1px) !important; opacity:.95 !important;
  }
  .strip__inner span:hover{ background:rgba(27,86,136,.06) !important; color:#134266 !important; }
  .strip__inner span:hover::before{ opacity:1 !important; }
}

/* =====================================================================
   Hlavička – střídání posledního slova ANDĚL ⇄ TÁBOR (TÁBOR modrý).
   „Anděl" drží šířku (v toku), „Tábor" je překryv → žádný posun layoutu.
   Respektuje prefers-reduced-motion.
   ===================================================================== */
.logo__swap{ position:relative; display:inline-block; }
.logo__swap-word{ display:inline-block; white-space:nowrap; }
.logo__w-andel{ animation:logoSwapA 6s ease-in-out infinite; }
.logo__w-tabor{ position:absolute; left:0; top:0; color:#1B5688; animation:logoSwapB 6s ease-in-out infinite; }
@keyframes logoSwapA{ 0%,42%{opacity:1} 50%,92%{opacity:0} 100%{opacity:1} }
@keyframes logoSwapB{ 0%,42%{opacity:0} 50%,92%{opacity:1} 100%{opacity:0} }
@media (prefers-reduced-motion:reduce){
  .logo__w-andel{ animation:none !important; opacity:1 !important; }
  .logo__w-tabor{ animation:none !important; opacity:0 !important; }
}

/* =====================================================================
   MOBIL (≤768) – PRÉMIOVÉ FROSTED SKLO: horní lišta (hamburger) + hero
   CTA „Zavolat nyní". Poloprůhledné + blur, s doladěnou čitelností textu.
   ===================================================================== */
@media (max-width:768px){
  /* horní bílá lišta – frosted glass */
  .header{
    background:rgba(255,255,255,.7) !important;
    -webkit-backdrop-filter:saturate(1.2) blur(14px) !important;
    backdrop-filter:saturate(1.2) blur(14px) !important;
    box-shadow:0 1px 0 rgba(16,24,40,.06), 0 10px 26px -14px rgba(16,24,40,.22) !important;
  }
  /* čitelnost v liště – logo tmavé, hamburger sytě tmavý */
  .header .logo__text strong{ color:#141b24 !important; }
  .header .nav-toggle span{ background:#10161f !important; }

  /* hero CTA „Zavolat nyní" – frosted glass */
  .hero__cta .btn--call,
  .hero__cta .btn--call.hero-call--activate{
    background:rgba(255,255,255,.64) !important;
    -webkit-backdrop-filter:blur(16px) saturate(1.25) !important;
    backdrop-filter:blur(16px) saturate(1.25) !important;
    color:#0e1f33 !important; font-weight:800 !important;
    border:1px solid rgba(255,255,255,.5) !important;
    box-shadow:0 16px 36px -10px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.55) !important;
  }
  .hero__cta .btn--call .ico{ color:#134266 !important; }
  .hero__cta .btn--call:hover,
  .hero__cta .btn--call:active{
    background:rgba(255,255,255,.78) !important; color:#0b1826 !important;
  }
}

/* =====================================================================
   FOTO PÁSY (jen mobil/menší ≤1024) – celoplošné fotky práce mezi
   sekcemi, aby scroll nebyl „moc bílý". Na desktopu skryté.
   ===================================================================== */
.photoband{ display:none; }
@media (max-width:1024px){
  .photoband{
    display:block; position:relative; margin:0; overflow:hidden; background:#0e1620;
  }
  .photoband img{
    display:block; width:100%; height:clamp(230px,62vw,400px);
    object-fit:cover; object-position:center;
  }
  .photoband__cap{
    position:absolute; left:0; right:0; bottom:0; margin:0;
    padding:38px 18px 14px;
    font-family:'Oswald',sans-serif; font-weight:600; font-size:12.5px; letter-spacing:1.4px;
    text-transform:uppercase; color:#fff;
    background:linear-gradient(180deg, rgba(8,13,22,0) 0%, rgba(8,13,22,.8) 100%);
    text-shadow:0 1px 4px rgba(0,0,0,.55);
  }
  .photoband__cap::before{
    content:"▲"; color:#73B4E6; font-size:9px; margin-right:9px; vertical-align:2px;
  }
}

/* Oprava gridu služeb na TABLETU (681–1024): 8 karet ve 2 sloupcích =
   4 čisté řádky. Ruší roztažení poslední karty přes celou šířku (které
   při sudém počtu nechávalo předposlední kartu osamocenou). */
@media (min-width:681px) and (max-width:1024px){
  .kb article:last-child{ grid-column:auto !important; }
}

/* ===== Sticky CTA i na TABLETU (681–1024 px) – vycentrovaný ===== */
@media (min-width:681px) and (max-width:1024px){
  .sticky-bar{
    display:block;position:fixed;left:0;right:0;margin:0 auto;bottom:16px;
    width:min(560px,calc(100% - 32px));height:56px;z-index:60;
  }
  body{padding-bottom:84px}
  .footer{padding-bottom:24px}
}

/* ===== Sticky telefonní CTA: plynulý přechod barvy a prémiová SVĚTLÁ
   varianta po doscrollování na konec sekce Kontakt (třída .sticky-bar--light) ===== */
.sticky-btn--phone{transition:background .35s ease,color .35s ease,box-shadow .35s ease !important}
.sticky-bar--light .sticky-btn--phone{
  background:linear-gradient(180deg,#ffffff 0%,#eef2f6 100%) !important;
  color:#12314e !important;
  box-shadow:0 12px 28px -10px rgba(16,24,40,.45),inset 0 1px 0 rgba(255,255,255,.85) !important;
}
.sticky-bar--light .sticky-btn--phone .ico{color:#1B5688 !important}

/* ===== Oprava zobrazení swap slova ANDĚL/TÁBOR v logu na MOBILU =====
   Na úzkých displejích se „VÝŠKOVÉ PRÁCE ANDĚL" nevešlo na jeden řádek
   (logo mělo white-space:nowrap) a swap slovo přeteklo mimo obrazovku.
   Nově se smí zalomit MEZI „Výškové práce" a swap slovo → ANDĚL/TÁBOR
   spadne na druhý řádek a je vždy viditelné. Oba díly drží pohromadě. */
@media (max-width:680px){
  .logo__text{ white-space:normal; }
  .logo__text strong{ line-height:1.12; }
  .logo__t1{ white-space:nowrap; }
  .logo__swap{ display:inline-block; }
}

/* Galerie služeb (#sluzby) – jen MOBIL/TABLET (≤1024):
   jemná tenká prémiová černá linka po obvodu rámu. */
@media (max-width:1024px){
  .svc__gallery{ border:1px solid rgba(6,9,14,.9) !important; }
}

/* ===================================================================
   ÚKOL 1/2 – text v sekci „Bezpečnost": zarovnání do bloku + tučné akcenty
   =================================================================== */
.bp-just{ text-align:justify; -webkit-hyphens:auto; hyphens:auto; }
.bp-just strong{ color:#16202E; font-weight:700; }

/* ===================================================================
   ÚKOL 4 – NÁPIS LOGA „VÝŠKOVÉ PRÁCE ANDĚL" (ANDĚL⇄TÁBOR) NA VŠECH ŠÍŘKÁCH
   =================================================================== */
/* (a) drobné telefony ≤330 px – zrušit skrytí (nápis se zalomí na 2 řádky) */
@media (max-width:330px){
  .logo__text{ display:flex !important; }
  .logo__text strong{ font-size:12px; letter-spacing:.2px; }
}
/* (b) úzký desktop 1025–1300 px – nápis ukázat a menu složit do hamburgeru
   (stejně jako na tabletu), aby se nápis vešel a nic vodorovně nepřetékalo */
@media (min-width:1025px) and (max-width:1340px){
  .logo__text{ display:flex !important; }
  .logo__text span{ display:block; }
  .nav{ display:none; position:absolute; top:100%; left:0; right:0; background:var(--yellow);
        flex-direction:column; padding:20px 24px; gap:18px; border-top:2px solid #000;
        box-shadow:0 16px 30px rgba(0,0,0,.18); }
  .nav.open{ display:flex; }
  .nav-toggle{ display:flex !important; }
}

/* ===== Nové úpravy (kontakt/FAQ) ===== */
/* Úkol 1+4 – skrýt na MOBILU (≤680): „Kde nás najdete…" a „a okolí" v FAQ nadpisu */
@media (max-width:680px){
  .hide-mobile{ display:none !important; }
  .faq-hd-tail{ display:none; }
}
/* Úkol 3 – lehké zvýraznění disclaimeru pod formulářem */
.reassure{ color:#3d4753 !important; }
.reassure strong{ color:#134266; font-weight:600; }

/* ===================================================================
   ZÁSADNÍ OPRAVA – nápis loga „VÝŠKOVÉ PRÁCE ANDĚL/TÁBOR" se nezobrazoval.
   Příčina: obecné pravidlo `.logo__text span{display:none}` (mířené na
   PODTITULEK) skrývalo i části nápisu uvnitř <strong> (.logo__t1 „Výškové
   práce" + .logo__swap „Anděl/Tábor"). Podtitulek je ale PŘÍMÝ potomek
   `.logo__text > span`. Vynutíme proto zobrazení částí nápisu ve <strong>
   – podtitulek zůstává řízený původními pravidly beze změny. =========== */
.logo__text > strong .logo__t1{ display:inline-block !important; }
.logo__text > strong .logo__swap{ display:inline-block !important; }
.logo__text > strong .logo__swap .logo__swap-word{ display:inline-block !important; }

/* ===================================================================
   ÚKOL 2 – mobilní/tablet HAMBURGER: výplň v barvě loga (modrý diamant
   #1C5688 = brand modrá), čárky bílé jako figura v logu.
   =================================================================== */
.nav-toggle{ background:#1C5688 !important; border:1px solid #1C5688 !important; }
.nav-toggle:hover{ background:#134266 !important; border-color:#134266 !important; }
.nav-toggle span{ background:#ffffff !important; }

/* ===================================================================
   Nápis loga „VÝŠKOVÉ PRÁCE ANDĚL / TÁBOR" – VĚTŠÍ a VÝRAZNĚJŠÍ
   =================================================================== */
.logo__text strong{ font-size:25px !important; letter-spacing:.5px !important; }
/* Velikost nápisu se scrollem NEMĚNÍ – compact = klidový stav (mění se jen logo a výška lišty) */
.header.header--compact .logo__text strong{ font-size:25px !important; }
@media (max-width:1024px){
  .logo__text strong{ font-size:21px !important; }
  .header.header--compact .logo__text strong{ font-size:21px !important; }
}
@media (max-width:680px){
  .logo__text strong{ font-size:20px !important; }
  .header.header--compact .logo__text strong{ font-size:20px !important; }
}
@media (max-width:360px){
  .logo__text strong{ font-size:15px !important; }
  .header.header--compact .logo__text strong{ font-size:15px !important; }
}
/* KLÍČOVÁ OPRAVA VELIKOSTI: pravidlo .logo__text span{font-size:12px} (pro
   PODTITULEK) omylem zmenšovalo i text nápisu ve <strong> (.logo__t1 a swap
   slova jsou také <span>). Spany uvnitř <strong> proto dědí velikost od <strong>. */
.logo__text > strong span{ font-size:inherit !important; }
/* barva: „Výškové práce" tmavá (dominantní kontrast), název „Anděl/Tábor" v brand modré */
.logo__text > strong .logo__t1{ color:#16202E !important; }
.logo__text .logo__w-andel{ color:#16202E !important; }
.logo__text .logo__w-tabor{ color:#1B5688 !important; }

/* ===================================================================
   Mobil (≤768) – hamburger sladěný s FROSTED (poloprůhlednou) hlavičkou:
   modré SKLO místo plné modré (poloprůhledná brand modrá + blur, bílé
   čárky, jemná světelná hrana). Vizuálně zapadne do sklovité lišty.
   =================================================================== */
@media (max-width:768px){
  .nav-toggle{
    background:rgba(27,86,136,.55) !important;
    border:1px solid rgba(255,255,255,.42) !important;
    -webkit-backdrop-filter:blur(10px) saturate(1.3) !important;
    backdrop-filter:blur(10px) saturate(1.3) !important;
    box-shadow:0 8px 20px -10px rgba(16,24,40,.45), inset 0 1px 0 rgba(255,255,255,.35) !important;
  }
  .nav-toggle:hover{ background:rgba(19,66,102,.62) !important; border-color:rgba(255,255,255,.5) !important; }
  .header .nav-toggle span{ background:#ffffff !important; }
}

/* ===================================================================
   Rozbalené hamburger menu (≤1340) – PRŮHLEDNÉ (frosted) pozadí místo
   plné výplně; ladí s frosted hlavičkou, text zůstává čitelný (tmavý).
   =================================================================== */
@media (max-width:1340px){
  .header .nav{
    background:rgba(255,255,255,.72) !important;
    -webkit-backdrop-filter:blur(18px) saturate(1.4) !important;
    backdrop-filter:blur(18px) saturate(1.4) !important;
    border-top:1px solid rgba(255,255,255,.5) !important;
    box-shadow:0 20px 40px -12px rgba(11,18,30,.28) !important;
  }
  .header .nav a{ color:#12233a !important; }
}

/* ===================================================================
   Mobil (≤680) – lišta „Nacházíte se na blogu" PŘEKRÝVÁ horní okraj hero,
   takže skrz její tmavé POLOPRŮHLEDNÉ sklo prosvítá tmavá obloha věže.
   Text čitelný/prémiový; „sluzbyhorolezcu.cz" BEZ zvýraznění, zvýrazněný
   je pouze odkaz.
   =================================================================== */
@media (max-width:680px){
  .sitenotice{
    position:relative; z-index:20;
    margin-bottom:-46px;                          /* překryv přes horní okraj hero */
    background:rgba(9,14,24,.40) !important;       /* tmavé sklo – obloha prosvítá */
    -webkit-backdrop-filter:blur(7px) saturate(1.2) !important;
    backdrop-filter:blur(7px) saturate(1.2) !important;
    border-bottom:none !important;
    color:#a6b1bf !important;
    text-shadow:0 1px 5px rgba(6,10,18,.45);
  }
  .hero{ padding-top:72px !important; }            /* obsah hero pod lištu */
  .sitenotice strong{ color:inherit !important; font-weight:400 !important; }  /* bez zvýraznění */
  .sitenotice a{ color:#9fd0f5 !important; font-weight:700 !important; text-decoration:none !important; }
  .sitenotice a:hover{ color:#c4e3fc !important; text-decoration:underline !important; }
}

/* ===================================================================
   Oprava kolize: značkový diamant (.sec-link) na začátku #proc překrýval
   popisek foto pásu nad ním. Na mobilu/tabletu (kde je foto pás vidět)
   přidáme #proc odsazení shora, aby diamant spadl pod popisek.
   =================================================================== */
@media (max-width:1024px){
  #proc{ margin-top:46px; }
}

/* ===================================================================
   HAMBURGER – prémiový, ČERNOBÍLÝ, BEZ RÁMEČKU.
   Čisté černé čáry, žádné pozadí ani ohraničení; platí na všech šířkách,
   kde se hamburger zobrazuje (ruší dřívější modré/frosted varianty).
   =================================================================== */
.nav-toggle,
.nav-toggle:hover,
.nav-toggle:focus,
.nav-toggle:active{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
.header .nav-toggle span,
.nav-toggle span{
  background:#14161a !important;      /* jemná černá */
  height:2px !important;
  border-radius:2px !important;
}
.nav-toggle:active{ transform:scale(.94); }

/* ===================================================================
   HAMBURGER – prémiové chování podle stavu lišty:
   • plná (nezmenšená) lišta → tenké černé čáry s jemným BÍLÝM prosvítáním
     (bílá vystupuje mezi/ kolem černých pruhů) – prémiový, vzdušný vzhled;
   • zmenšená (compact) lišta → čáry ZTLOUSTNOU a jsou plně černé.
   =================================================================== */
.header:not(.header--compact) .nav-toggle span{
  height:2px !important;
  background:#14161a !important;
  box-shadow:0 0 2px rgba(255,255,255,.92), 0 1px 2px rgba(0,0,0,.22) !important;
}
.header.header--compact .nav-toggle span{
  height:3.5px !important;
  background:#0c0e12 !important;
  box-shadow:none !important;
}

/* ===================================================================
   Mobil (≤680) – štítek „REKLAMA" SVISLE po levém boku reklamy (prémiové),
   vpravo text a tlačítko; jemný svislý oddělovač.
   =================================================================== */
@media (max-width:680px){
  .adslot__inner{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-template-areas:
      "tag text"
      "tag cta";
    align-items:center;
    column-gap:16px; row-gap:12px;
    padding:16px 18px;
  }
  .adslot__tag{
    grid-area:tag; align-self:stretch;
    display:flex; align-items:center; justify-content:center;
    writing-mode:vertical-rl; text-orientation:mixed;
    border:0 !important; border-radius:0 !important;
    border-right:1px solid rgba(255,255,255,.18) !important;
    margin:0; padding:0 14px 0 0;
    font-size:10px; letter-spacing:3px; color:#8b939d;
  }
  .adslot__text{ grid-area:text; min-width:0; }
  .adslot__cta{ grid-area:cta; width:100%; justify-content:center; }
}

/* ===================================================================
   Footer sloupec „S čím vám můžeme pomoci" – na MOBILU (≤680) skládací
   (klik na nadpis skryje/zobrazí odkazy); na tabletu/desktopu vždy rozbalené.
   =================================================================== */
.footer-acc__sum{
  list-style:none; display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.footer-acc__sum::-webkit-details-marker{ display:none; }
.footer-acc__sum::marker{ content:""; }
.footer-acc__sum h4{ margin:0; }
.footer-acc__sum::after{
  content:"⌄"; font-family:'Oswald',sans-serif; font-size:17px; line-height:1;
  opacity:.75; transition:transform .25s ease; display:none;
}
@media (max-width:680px){
  .footer-acc__sum{ cursor:pointer; }
  .footer-acc__sum::after{ display:block; }
  .footer-acc[open] .footer-acc__sum::after{ transform:rotate(180deg); }
  .footer-acc > summary + *{ margin-top:12px; }
}
@media (min-width:681px){
  .footer-acc > :not(summary){ display:block !important; }   /* vždy rozbalené */
  .footer-acc__sum{ pointer-events:none; }
}

/* Mobil (≤680) – v liště zkrátit text: skrýt „Nacházíte se na blogu…",
   ponechat jen „Navštivte oficiální stránky VÝŠKOVÉ PRÁCE ANDĚL →". */
@media (max-width:680px){
  .sn-line--blog{ display:none !important; }
}

/* Mobil/tablet (≤1024) – samostatné foto pásy obtažené tenkou černou
   prémiovou linkou (stejně jako galerie). */
@media (max-width:1024px){
  .photoband{ border:1px solid rgba(6,9,14,.92); }
}

/* ===================================================================
   Mobil (≤680) – odstranit logo separátoru (.sec-link) a zrušit jeho
   kompenzační odsazení sekce #proc (už není co odsazovat).
   =================================================================== */
@media (max-width:680px){
  .sec-link{ display:none !important; }
  #proc{ margin-top:0 !important; }
}
/* Desktop/tablet (≥681) – footer accordion je vždy rozbalený i v novějším
   Chrome (::details-content), aby po odebrání atributu open zůstal otevřený. */
@media (min-width:681px){
  .footer-acc::details-content{ content-visibility:visible !important; }
}

/* Sekce Bezpečnost – fotka kostela: odebrat modré rohové grafické prvky
   (šipky/závorky přes ::before a ::after). */
#bezpecnost .split__media::before,
#bezpecnost .split__media::after{ content:none !important; display:none !important; }

/* ===================================================================
   „Jak práce probíhá" – kroužky s čísly: prémiové a výrazné na bílé sekci.
   Signální bílá výplň + jemný modrý prsten + měkký vyvýšený (branded) stín,
   tmavé číslo; na desktopu hover přechod do brand modré s bílým číslem.
   =================================================================== */
.steps li span{
  background:#ffffff !important;
  border:1.5px solid rgba(27,86,136,.30) !important;
  color:#16202E !important;
  box-shadow:0 14px 28px -12px rgba(27,86,136,.40), 0 3px 8px rgba(16,24,40,.10),
             inset 0 1px 0 rgba(255,255,255,.9) !important;
  transition:transform .28s ease, box-shadow .28s ease, background .28s ease,
             color .28s ease, border-color .28s ease;
}
@media (min-width:681px){
  .steps li:hover span{
    background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
    border-color:#15426A !important;
    color:#ffffff !important;
    box-shadow:0 18px 36px -12px rgba(27,86,136,.60), inset 0 1px 0 rgba(255,255,255,.22) !important;
  }
}

/* ===================================================================
   Sekce Nacenění (#cenik) – na DESKTOPU (≥981) obrázek vedle textového
   boxu, stejně vysoký, responzivní, s tenkou černou prémiovou linkou.
   =================================================================== */
/* ===================================================================
   #cenik – prémiový case-study modul „Jak u nás vzniká cena" (redesign)
   Nadpis přes celou šířku, dole text vlevo + foto-karta vpravo.
   Na tabletu/mobilu se foto zobrazí jako centrovaná karta (logické pořadí).
   =================================================================== */
#cenik{ background:linear-gradient(180deg,#fbfcfd 0%,#eaeff4 100%); }

.cenik__wrap{ display:grid; grid-template-columns:1fr;
  grid-template-areas:"head" "media" "text"; gap:28px 0; align-items:start; }
.cenik__head{ grid-area:head; }
.cenik__text{ grid-area:text; min-width:0; }
.cenik__media{ grid-area:media; display:block; margin:0; }

/* Nadpisová část – čistá hierarchie a návaznost */
#cenik .eyebrow{ margin-bottom:12px; }
#cenik .h2{ line-height:1.06; margin-bottom:0; }

/* Text – čitelnost, optické členění, sjednocené zvýraznění */
#cenik .cenik__text > p{ max-width:64ch; font-size:16px; line-height:1.72; color:#3a434e; margin:0 0 15px; }
#cenik .cenik__text > p:last-of-type{ margin-bottom:0; }
#cenik .cenik__text > p strong{ color:#16202E; font-weight:700; }

/* „Působnost" – prémiový info box (ne šedá poznámka) */
#cenik .note{ display:flex; gap:14px; align-items:flex-start; max-width:64ch;
  margin-top:28px; padding:18px 20px; background:#ffffff !important;
  border:1px solid #d7dee6 !important; border-left:4px solid #1B5688 !important; border-radius:14px;
  box-shadow:0 20px 44px -30px rgba(16,24,40,.45); color:#3a434e !important; font-size:15px; line-height:1.6; }
#cenik .note__ico{ flex:none; width:38px; height:38px; border-radius:11px;
  background:rgba(27,86,136,.10); color:#1B5688; display:flex; align-items:center; justify-content:center; }
#cenik .note__ico svg{ width:20px; height:20px; }
#cenik .note__body strong{ color:#16202E; }

#cenik .areas{ margin-top:24px; }
#cenik .cta-row{ margin-top:28px; }

/* Case-study foto karta */
.cenik__media-frame{ border-radius:18px; overflow:hidden; background:#0e1620;
  border:1px solid rgba(6,9,14,.10);
  box-shadow:0 40px 80px -34px rgba(16,24,40,.6), 0 12px 26px -18px rgba(16,24,40,.4); }
.cenik__media-frame img{ display:block; width:100%; height:auto; aspect-ratio:3/4;
  object-fit:cover; object-position:82% 70%; } /* lezec je vpravo dole – vždy v záběru */
.cenik__media-cap{ display:flex; align-items:center; gap:11px; margin-top:15px;
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:600; letter-spacing:.9px;
  text-transform:uppercase; color:#4a5460; line-height:1.35; }
.cenik__media-cap-ico{ flex:none; width:27px; height:27px; border-radius:50%;
  background:#1B5688; color:#fff; display:flex; align-items:center; justify-content:center; }
.cenik__media-cap-ico svg{ width:14px; height:14px; }

/* Tablet + mobil – foto jako centrovaná karta, ne přes celou šířku */
@media (max-width:980px){
  .cenik__media{ width:100%; max-width:400px; margin-left:auto; margin-right:auto; }
}
@media (max-width:520px){
  .cenik__media{ max-width:none; }
  #cenik .note{ max-width:none; }
  #cenik .cenik__text > p{ max-width:none; }
}

/* Desktop – nadpis přes celou šířku, text vlevo, foto-karta vpravo vedle textu */
@media (min-width:981px){
  .cenik__wrap{ grid-template-columns:minmax(0,1fr) minmax(400px,480px);
    grid-template-areas:"head head" "text media";
    column-gap:clamp(44px,4.5vw,68px); row-gap:22px; align-items:start; }
  .cenik__media{ align-self:stretch; display:flex; flex-direction:column; }
  .cenik__media-frame{ flex:1 1 auto; }
  .cenik__media-frame img{ aspect-ratio:auto; height:100%; min-height:520px; object-fit:cover; }
}



/* ===== T1: footer accordion nadpisy „O webu" / „S čím vám můžeme pomoci" – na mobilu podtržené ===== */
@media (max-width:680px){
  .footer-acc__sum h4{ text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }
}

/* ===== T3: prémiová pobídka ke scrollování na fotografii (01) → (02) ===== */
.photoband__next{
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; align-items:center; gap:6px; z-index:4;
  color:#fff; text-decoration:none; padding:11px 10px; border-radius:14px;
  background:rgba(11,18,30,.36); -webkit-backdrop-filter:blur(7px) saturate(1.2);
  backdrop-filter:blur(7px) saturate(1.2); border:1px solid rgba(255,255,255,.30);
  box-shadow:0 10px 24px -10px rgba(0,0,0,.5);
}
.photoband__next-lbl{ font-family:'Oswald',sans-serif; font-weight:600; font-size:11px;
  letter-spacing:1.2px; text-transform:uppercase; line-height:1.15; text-align:center; }
.photoband__next-lbl small{ display:block; font-size:9px; font-weight:500; opacity:.82; letter-spacing:.6px; }
.photoband__next svg{ width:22px; height:22px; animation:pbNext 1.6s ease-in-out infinite; }
@keyframes pbNext{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(4px)} }
@media (prefers-reduced-motion:reduce){ .photoband__next svg{ animation:none; } }

/* ===== T4: mobil – prémiový přehled činností (ikona + popis) + konverzní CTA ===== */
.kb-sum{ display:none; }
@media (max-width:680px){
  #vykon .kb{ display:none !important; }
  .kb-sum{ display:block; }
  .kb-sum__lead{ font-weight:600; color:#16202E; margin:0 0 18px; font-size:16px; line-height:1.55; }
  .kb-sum__lead strong{ color:#1B5688; }
  .kb-sum__grid{ display:grid; gap:12px; }
  .kb-sum__item{ display:flex; gap:14px; align-items:flex-start; background:#ffffff;
    border:1px solid rgba(6,9,14,.10); border-left:3px solid #1B5688; border-radius:14px;
    padding:16px; box-shadow:0 14px 30px -22px rgba(16,24,40,.5); }
  .kb-sum__ico{ flex:none; width:42px; height:42px; border-radius:12px; color:#1B5688;
    background:rgba(27,86,136,.10); display:flex; align-items:center; justify-content:center; }
  .kb-sum__ico svg{ width:23px; height:23px; }
  .kb-sum__title{ display:block; font-family:'Oswald',sans-serif; font-weight:600; font-size:15.5px;
    color:#16202E; line-height:1.25; margin-bottom:5px; }
  .kb-sum__desc{ margin:0; color:#4b535c; font-size:14px; line-height:1.5; }
  .kb-sum__cta{ margin-top:18px; background:#ffffff; border:1px solid rgba(6,9,14,.10);
    border-radius:14px; padding:20px 18px; text-align:center;
    box-shadow:0 14px 30px -22px rgba(16,24,40,.5); }
  .kb-sum__ctatext{ margin:0 0 16px; color:#3d4753; font-size:14.5px; line-height:1.55; }
  .kb-sum__btns{ display:grid; gap:10px; }
  .kb-sum__btns .btn{ width:100%; justify-content:center; }
}

/* ===== T7: mobil – klienty (9 polí) shrnout do 5 oborových karet ===== */
.clients-m{ display:none; }
@media (max-width:680px){
  #reference .clients__list, #reference .clients__more{ display:none !important; }
  .clients-m{ display:block; margin-top:20px; }
  .clients-m__intro{ color:#3a424c; font-size:15px; line-height:1.6; margin:0 0 16px; }
  .clients-m__intro strong{ color:#0f1a2b; }
  .clients-m__text{ margin:0; color:#3a424c; font-size:15.5px; line-height:1.75; letter-spacing:.1px; }
  .clients-m__text strong{ color:#1B5688; font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:.4px; }
}

/* T7 (oprava): #pro-koho – na mobilu 5 dlaždic místo 9.
   Pozn.: .refs-m má i třídu .refs, kterou globálně přebíjí `.refs{display:grid !important}`.
   Proto musí být skrytí na desktopu také !important, jinak se zobrazí oba seznamy. */
.refs-m{ display:none !important; }
@media (max-width:680px){
  #pro-koho .refs:not(.refs-m){ display:none !important; }
  .refs-m{ display:grid !important; }
}
/* #reference – mobilní oborový odstavec: barvy řeší blok výše (světlé pozadí #f4f5f6) */

/* Po odeslání poptávky (inline poděkování) skryjeme už nadbytečný úvodní text sekce – všechna zobrazení */
#poptavka.is-sent .eyebrow,
#poptavka.is-sent .h2,
#poptavka.is-sent .lead{ display:none !important; }

/* Sticky lišta po odeslání poptávky (mobil): místo telefonu tlačítko „Vrátit se zpět" (odlišná bílá barva) */
.sticky-btn--top{ background:#ffffff; color:#16202E;
  box-shadow:0 8px 24px rgba(0,0,0,.28),0 2px 6px rgba(0,0,0,.12); }
.sticky-bar.is-done .sticky-btn--inquiry,
.sticky-bar.is-done .sticky-btn--phone{ opacity:0 !important; pointer-events:none !important; }
.sticky-bar.is-done .sticky-btn--top{ opacity:1; transform:translateY(0) scale(1);
  pointer-events:auto; animation:stickyIn .45s var(--ease); }

/* ===== Bod 3: modernizace patičky (PC a větší) – jednotné nadpisy, urovnané sloupce ===== */
.footer h4{ font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:1.5px;
  font-size:15px; font-weight:600; }
@media (min-width:681px){
  .footer__inner{ align-items:start; column-gap:56px; }
  .footer__inner > div{ min-width:0; }
  .footer-acc > summary + *{ margin-top:14px; }           /* stejná mezera pod nadpisem jako u navigace */
  .footer__col-web h4{ margin-bottom:14px; }
  .footer ul{ gap:10px; }
}

/* =====================================================================
   HERO – DESKTOP FOTO (≥1025 px): výškoví pracovníci nad Táborem, večer.
   Platí POUZE na desktopu / velkých displejích. MOBIL PONECHÁN BEZE ZMĚNY –
   na <1025 px se toto pravidlo neuplatní, takže tam zůstává inline věž
   z index.html. Aditivní/chirurgické: přebíjí globální filtr (brightness+
   sepia laděný na starou věž) a desktopovou polohu pozadí kvůli nové
   šířkové kompozici; overlay se záměrně nemění (už ztmavuje pravou stranu
   za textem a nechává subjekty vlevo čitelné). */
@media (min-width:1025px){
  .hero__bg{
    background-image:url('../img/hero-desktop-vyskove-prace-tabor.webp?v=1') !important;
    background-size:cover !important;              /* fotka vyplní celý hero – nikde prázdno */
    background-position:center bottom !important;  /* CELÍ pracovníci (ne jen hlavy) */
    filter:contrast(1.04) saturate(1.05) !important;
  }
}


/* =====================================================================
   HEROSTATS – přednosti + reference vyjmuté z hera do samostatného pruhu
   pod ním (hero je teď čistě nadpis + CTA nad fotkou). Aditivní. */
.herostats{background:#0b121e;border-top:1px solid rgba(255,255,255,.07);color:#e8eef4}
.herostats__inner{padding:clamp(58px,8vh,92px) 0}
.herostats__head{display:block;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:#5f9bd0;margin:0 0 26px}
/* statistiky jako karty (styl .feat) – vyšší specifita přebije skrytí v hero i kartový rámeček */
.herostats .hero__usps{display:grid !important;grid-template-columns:repeat(4,1fr);gap:18px !important;border:0 !important;border-radius:0 !important;overflow:visible !important;padding:0 !important;margin:0 !important}
.herostats .hero__usps li{padding:28px 26px !important;border:1px solid rgba(255,255,255,.12) !important;border-left:1px solid rgba(255,255,255,.12) !important;border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));color:#aeb8c4}
.herostats .hero__usps strong{display:block;font-family:'Anton',sans-serif;font-size:40px;line-height:1;color:#d6e7f9 !important;margin-bottom:10px;letter-spacing:.5px}
.herostats .hero__refs{display:block !important;margin:34px 0 0 !important;color:#8a95a2 !important;font-size:13px;letter-spacing:1.4px;line-height:1.75}
.herostats .ref-jump--hero{display:inline-flex !important;margin:26px 0 0 !important}
@media (max-width:1024px){.herostats .hero__usps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.herostats .hero__usps{grid-template-columns:1fr}.herostats .ref-jump--hero{display:flex !important;width:100%}}

/* HERO desktop: obsah blíž k liště (menší horní mezera) + zkrácení = horolezci výš */
@media (min-width:1025px){
  .hero{ align-items:flex-start !important; padding-top:44px !important; padding-bottom:54px !important; min-height:78vh !important; }
}

/* „Prozkoumat" – PŮVODNÍ tlačítko (beze změny vzhledu), jen přemístěné
   vpravo do modrého bloku „horolezeckou technikou", svisle na střed. */
@media (min-width:1025px){
  .hero__mark{ position:relative; padding-right:150px !important; }
  .hero__scrolldown{
    top:50% !important; right:16px !important; bottom:auto !important; left:auto !important;
    transform:translateY(-50%) !important;
  }
  .hero__scrolldown:hover,.hero__scrolldown:focus-visible{ transform:translateY(-50%) translateY(-3px) !important; }
}


/* =====================================================================
   LIŠTA: text (navigace + logo) drží plnou tmavou barvu i váhu na VŠECH
   šířkách – nikdy nezesvětlá (oprava zesvětlení při zúžení okna). */
.header .nav a,
.header .nav a:link,
.header .nav a:visited{ color:#13202e !important; opacity:1 !important; font-weight:600 !important; }
.header .logo__text strong{ color:#13202e !important; opacity:1 !important; }

/* =====================================================================
   GALERIE – jednotné barevné ladění. Každá fotka má vlastní korekci
   jasu / kontrastu / sytosti, stažení k mediánu sady (jas 108, kontrast
   79, sytost 79), aby všechny fotky k sobě ladily. */


/* =====================================================================
   LOGO SWAP Anděl↔Tábor: text vedle loga NESMÍ zesvětlat (ani při scrollu).
   Původní prolínání shazovalo slovo na ~50 % opacity uprostřed přechodu.
   Nahrazeno TVRDÝM přepnutím – každé slovo je vždy plně syté (opacity 1),
   přepíná se skokem, žádné vyblednutí. (Přepisuje původní keyframes.) */
@keyframes logoSwapA{ 0%,47%{opacity:1} 47.01%,97%{opacity:0} 97.01%,100%{opacity:1} }
@keyframes logoSwapB{ 0%,47%{opacity:0} 47.01%,97%{opacity:1} 97.01%,100%{opacity:0} }
/* pojistka: obě slova drží plnou barvu i opacitu ve viditelném stavu, na všech šířkách */
.header .logo__text strong,
.header .logo__text .logo__t1,
.header .logo__text .logo__w-andel,
.header .logo__text .logo__w-tabor{ opacity:1; }


/* Portrét zakladatele (sekce Bezpečnost) – prémiový popisek přes spodní scrim */
.split__media{ position:relative; }
.split__caption{ position:absolute; left:0; right:0; bottom:0; padding:26px 24px 20px;
  display:flex; flex-direction:column; gap:4px; pointer-events:none; border-radius:0 0 4px 4px;
  background:linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,.45) 52%, rgba(0,0,0,0)); }
.split__caption-name{ font-family:'Anton','Oswald',sans-serif; text-transform:uppercase; letter-spacing:.5px;
  font-size:clamp(20px,2.2vw,24px); line-height:1; color:#fff; }
.split__caption-role{ font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
  letter-spacing:2px; font-size:12px; color:rgba(255,255,255,.82); }

/* MOBIL/TABLET (≤1024): pruh statistik + „Proč zvolit…" ZPĚT SKRYTÝ – jako
   v původní odladěné mobilní verzi (na mobilu se tyto prvky nezobrazují). */
@media (max-width:1024px){ .herostats{ display:none !important; } }


/* =====================================================================
   OPRAVA: text loga „Výškové práce Anděl/Tábor" i navigace NIKDY nezesvětlá
   při scrollu. Příčina byla POLOPRŮHLEDNÁ lišta (frosted glass) – při scrollu
   za ní projíždělo tmavé hero, podklad ztmavl a tmavý text ztratil kontrast.
   Řešení: lišta je plně neprůhledná ve všech stavech i šířkách. */
@media (min-width:769px){
  .header, .header.header--compact{ background:#ffffff !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
}
@media (max-width:768px){
  .header{ background:#ffffff !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
}
/* pojistka barvy/opacity textu loga ve všech stavech (i kompaktní) */
.header .logo__text strong,
.header.header--compact .logo__text strong,
.header .logo__text .logo__t1,
.header.header--compact .logo__text .logo__t1{ color:#13202e !important; opacity:1 !important; }
.header .logo__text .logo__w-andel{ color:#13202e !important; }
.header .logo__text .logo__w-tabor{ color:#1B5688 !important; }


/* =====================================================================
   GALERIE – doladění: (1) silnější ztmavení dvou přesvětlených fotek,
   (2) prémiový popisek (společný prvek u každé fotky), (3) jemnější rám. */

/* prémiový popisek fotky */
.svc__caption{
  padding:66px 24px 20px !important;
  background:linear-gradient(180deg,transparent 0%,rgba(8,13,22,.5) 42%,rgba(8,13,22,.92) 100%) !important;
  font-family:'Oswald',sans-serif !important; font-weight:600 !important; font-size:15px !important;
  letter-spacing:.5px !important; text-shadow:0 1px 12px rgba(0,0,0,.55) !important; color:#fff !important;
}
.svc__caption::before{
  content:""; display:inline-block; width:24px; height:2px; margin:0 11px 4px 0;
  background:#5fa2df; vertical-align:middle; border-radius:2px;
}

/* jemnější, prémiovější rám */
@media (min-width:981px){
  .svc__gallery{ padding:12px !important; border:1px solid rgba(95,162,223,.16) !important; }
  .svc__stage{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), 0 18px 40px rgba(0,0,0,.5) !important; }
}


/* =====================================================================
   GALERIE v2 – jednotný filmový grading (přesvětlené/denní ztmaveny,
   zeleně odsyceny) + ČISTÝ profesionální rám (bez tlusté tmavé bordury). */

/* ČISTÝ RÁM: fotka od kraje ke kraji, jemné zaoblení, decentní stín. Žádná bordura. */
.svc__gallery{ padding:0 !important; background:transparent !important; border:none !important;
  border-radius:14px !important; overflow:hidden !important;
  box-shadow:0 26px 64px -24px rgba(11,18,30,.6), 0 2px 8px rgba(11,18,30,.14) !important; }
.svc__gallery::before{ display:none !important; }
.svc__stage{ border-radius:14px !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.10) !important; }
.svc__stage::after{ border-radius:14px !important; }
.svc__slide{ border-radius:14px !important; }
@media (min-width:981px){ .svc__gallery{ padding:0 !important; border:none !important; } .svc__stage{ min-height:520px; } }

/* Popisek – prémiový, čitelný, se štítkovým akcentem (společný prvek u každé fotky) */
.svc__caption{ padding:70px 26px 22px !important;
  background:linear-gradient(180deg,transparent 0%,rgba(6,11,20,.45) 40%,rgba(6,11,20,.94) 100%) !important;
  font-family:'Oswald',sans-serif !important; font-weight:600 !important; font-size:16px !important;
  letter-spacing:.6px !important; color:#fff !important; text-shadow:0 2px 14px rgba(0,0,0,.6) !important; }
.svc__caption::before{ content:""; display:inline-block; width:26px; height:2px; margin:0 12px 4px 0;
  background:#5fa2df; vertical-align:middle; border-radius:2px; }

/* Popisek fotky – uvnitř .svc__stage, nad vším ostatním, spolehlivě viditelný */
.svc__stage .svc__caption{ position:absolute !important; left:0 !important; right:0 !important; bottom:0 !important;
  z-index:6 !important; display:block !important; padding:66px 26px 46px !important; }
@media (min-width:681px){ .svc__caption{ display:block !important; } }

/* =====================================================================
   ===  HERO – plovoucí značková lišta „LUKÁŠ ANDĚL" (várka 5b) =======
   Prémiový trust-prvek na JEDEN ŘÁDEK v levé části hero fotky (desktop /
   velká zobrazení). Frosted-glass lišta s akcentovým keylinem, ověřovací
   pečetí, IČO a působištěm. Výrazná a dobře čitelná; lehké plování,
   světelný přejezd, pulz pečeti. Posazená výš, aby nebyla nikdy oříznutá.
   Cíl: okamžité rozpoznání značky Anděl = vyšší důvěra a konverze.
   ===================================================================== */
.hero__plate{
  display:none;                 /* výchozí skryté; zobrazí se od desktopu */
  position:fixed;               /* přišpendleno – zůstává na místě při scrollu */
  left:clamp(24px,3.4vw,64px);
  top:clamp(120px,16vh,190px);  /* CSS fallback; JS zarovná s řádkem eyebrow */
  bottom:auto;
  z-index:40;                   /* nad obsahem, pod hlavičkou (z-index:50) */
  pointer-events:none;
  transform-origin:left top;    /* auto-fit zmenšení drží horní hranu na místě */
  opacity:1;
  transition:opacity .38s ease, visibility .38s ease;   /* jemné zmizení u „Proč zvolit…" */
  animation:plateIn .9s ease .5s backwards;             /* nástup, bez forwards → nepřebíjí skrytí */
  will-change:transform,opacity;
}
/* Skrytí po doscrollování na „Proč zvolit Výškové práce Anděl" (řídí JS) */
.hero__plate.is-gone{opacity:0;visibility:hidden;pointer-events:none}
.hero__plate-inner{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:17px;
  padding:15px 26px 15px 16px;
  border:1px solid rgba(255,255,255,.17);
  border-left:3px solid var(--yellow);
  border-radius:9px;
  background:linear-gradient(135deg,rgba(16,25,41,.74) 0%,rgba(10,16,27,.64) 100%);
  -webkit-backdrop-filter:blur(12px) saturate(1.12);
  backdrop-filter:blur(12px) saturate(1.12);
  box-shadow:
    0 26px 60px rgba(0,0,0,.52),
    0 6px 16px rgba(0,0,0,.42),
    0 0 0 1px rgba(27,86,136,.18),
    inset 0 1px 0 rgba(255,255,255,.11);
  overflow:hidden;
  white-space:nowrap;
  animation:plateFloat 8.5s ease-in-out 1.35s infinite;
  will-change:transform;
}
.hero__plate-inner::before{      /* jemná horní světelná linka – prémiový detail */
  content:"";position:absolute;left:16px;right:16px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  pointer-events:none;
}
/* Ověřovací pečeť (štít + fajfka) – vizuální signál důvěry */
.hero__plate-seal{
  flex:0 0 auto;display:grid;place-items:center;
  width:40px;height:40px;border-radius:11px;color:#fff;
  background:linear-gradient(140deg,var(--yellow) 0%,var(--yellow-2) 100%);
  box-shadow:0 10px 22px rgba(27,86,136,.55),inset 0 1px 0 rgba(255,255,255,.32);
  animation:plateSealPulse 4.2s ease-in-out infinite;
}
.hero__plate-seal svg{width:23px;height:23px;display:block}
/* Jméno (Anton), IČO + působiště (Oswald) */
.hero__plate-name{
  font-family:'Anton',sans-serif;text-transform:uppercase;
  letter-spacing:.8px;font-size:clamp(20px,1.75vw,27px);
  color:#fff;line-height:1;text-shadow:0 2px 16px rgba(0,0,0,.55);
}
.hero__plate-div{
  width:1px;height:23px;flex:0 0 auto;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.5),transparent);
}
.hero__plate-ico,
.hero__plate-dic{
  font-family:'Oswald',sans-serif;text-transform:uppercase;
  letter-spacing:1.8px;font-size:clamp(12px,1vw,14px);font-weight:500;color:#b9d2e6;
}
.hero__plate-loc{
  font-family:'Oswald',sans-serif;text-transform:uppercase;
  letter-spacing:2.6px;font-size:clamp(12px,1vw,14px);font-weight:500;
  color:rgba(255,255,255,.74);
}
/* Světelný přejezd přes lištu */
.hero__plate-sheen{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 36%,rgba(255,255,255,.18) 50%,transparent 64%);
  transform:translateX(-130%);
  animation:plateSheen 7.5s ease-in-out 1.7s infinite;
}
@keyframes plateIn{from{opacity:0}to{opacity:1}}
@keyframes plateFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes plateSealPulse{
  0%,100%{box-shadow:0 10px 22px rgba(27,86,136,.55),inset 0 1px 0 rgba(255,255,255,.32)}
  50%{box-shadow:0 10px 30px rgba(27,86,136,.9),inset 0 1px 0 rgba(255,255,255,.36)}
}
@keyframes plateSheen{0%{transform:translateX(-130%)}22%,100%{transform:translateX(130%)}}
/* Zobrazení: desktop (vlevo je fotka) a větší */
@media (min-width:1025px){.hero__plate{display:block}}
/* Střední desktopy – jemně kompaktnější, aby auto-fit nemusel příliš zmenšovat */
@media (min-width:1025px) and (max-width:1499px){
  .hero__plate-inner{gap:13px;padding:13px 20px 13px 14px}
  .hero__plate-name{font-size:clamp(18px,1.5vw,22px)}
  .hero__plate-ico,.hero__plate-dic{letter-spacing:1.4px}
  .hero__plate-loc{letter-spacing:2px}
  .hero__plate-seal{width:36px;height:36px;border-radius:10px}
  .hero__plate-seal svg{width:21px;height:21px}
}
@media (min-width:1500px){
  .hero__plate{left:clamp(32px,3vw,80px)}
  .hero__plate-inner{gap:18px;padding:16px 28px 16px 17px}
}
/* Omezit pohyb – vypnout animace, ale ponechat auto-fit (transform řídí JS) */
@media (prefers-reduced-motion:reduce){
  .hero__plate{animation:none;opacity:1;transition:none}
  .hero__plate.is-gone{opacity:0;visibility:hidden}
  .hero__plate-inner,.hero__plate-seal,.hero__plate-sheen{animation:none}
  .hero__plate-sheen{display:none}
}

/* =====================================================================
   ===  HERO – lišta jako ROZKLIKÁVACÍ tlačítko + afordance (várka 5c) =
   ===================================================================== */
.hero__plate{pointer-events:none}          /* okolí propouští, klikací je jen lišta */
.hero__plate-inner{
  pointer-events:auto;cursor:pointer;text-align:left;
  transition:border-color .25s ease,box-shadow .25s ease,background .25s ease;
}
.hero__plate-inner:hover,
.hero__plate-inner:focus-visible{
  border-color:rgba(255,255,255,.32);
  box-shadow:0 30px 66px rgba(0,0,0,.56),0 6px 16px rgba(0,0,0,.44),
             0 0 0 1px rgba(27,86,136,.34),inset 0 1px 0 rgba(255,255,255,.14);
}
.hero__plate-inner:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
/* afordance „Profil ›" na konci lišty */
.hero__plate-more{
  display:inline-flex;align-items:center;gap:6px;margin-left:2px;padding:6px 11px;
  border-radius:999px;background:rgba(27,86,136,.30);border:1px solid rgba(146,185,220,.38);
  color:#dcebf7;font-family:'Oswald',sans-serif;text-transform:uppercase;
  letter-spacing:1.3px;font-size:11px;font-weight:500;white-space:nowrap;
  transition:background .25s ease,border-color .25s ease,color .25s ease;
}
.hero__plate-more svg{width:13px;height:13px;transition:transform .25s ease}
.hero__plate-inner:hover .hero__plate-more,
.hero__plate-inner:focus-visible .hero__plate-more{background:var(--yellow);border-color:var(--yellow);color:#fff}
.hero__plate-inner:hover .hero__plate-more svg,
.hero__plate-inner:focus-visible .hero__plate-more svg{transform:translateX(3px)}

/* =====================================================================
   ===  HERO – mobilní/tabletový spouštěč profilu (< 1025px) ==========
   ===================================================================== */
.hero__profile{display:none}
@media (max-width:1024px){
  .hero__profile{
    display:flex;align-items:center;gap:12px;width:100%;margin-top:18px;
    padding:13px 14px;border:1px solid rgba(255,255,255,.16);border-left:3px solid var(--yellow);
    border-radius:11px;text-align:left;color:#fff;cursor:pointer;
    background:linear-gradient(135deg,rgba(19,29,45,.64),rgba(11,18,30,.52));
    -webkit-backdrop-filter:blur(9px) saturate(1.08);backdrop-filter:blur(9px) saturate(1.08);
    box-shadow:0 14px 32px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08);
    transition:border-color .2s ease,box-shadow .2s ease;
  }
}
.hero__profile:active{box-shadow:0 8px 20px rgba(0,0,0,.4)}
.hero__profile-seal{
  flex:0 0 auto;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:#fff;
  background:linear-gradient(140deg,var(--yellow),var(--yellow-2));
  box-shadow:0 8px 18px rgba(27,86,136,.5),inset 0 1px 0 rgba(255,255,255,.3);
}
.hero__profile-seal svg{width:22px;height:22px}
.hero__profile-txt{display:flex;flex-direction:column;min-width:0;flex:1}
.hero__profile-txt strong{font-family:'Anton',sans-serif;text-transform:uppercase;letter-spacing:.5px;font-size:16px;line-height:1.05}
.hero__profile-txt span{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.6px;font-size:10.5px;color:#a9c6df;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hero__profile-chev{width:20px;height:20px;flex:0 0 auto;color:#9db9d0}

/* =====================================================================
   ===  PROFILOVÉ OKNO (modal) – Lukáš Anděl  =========================
   ===================================================================== */
body.bio-open{overflow:hidden}
.bio{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:clamp(12px,3vw,34px)}
.bio[hidden]{display:none}
.bio__backdrop{position:absolute;inset:0;background:rgba(6,10,16,.74);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;animation:bioFade .28s ease forwards}
.bio__dialog{
  position:relative;z-index:1;width:min(940px,100%);max-height:88vh;display:flex;flex-direction:column;
  color:#e8edf3;background:linear-gradient(180deg,#141d29 0%,#0e141d 100%);
  border:1px solid rgba(255,255,255,.13);border-radius:15px;overflow:hidden;
  box-shadow:0 44px 130px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.06);
  opacity:0;transform:translateY(18px) scale(.986);
  animation:bioIn .36s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes bioFade{to{opacity:1}}
@keyframes bioIn{to{opacity:1;transform:none}}
.bio__close{
  position:absolute;top:12px;right:12px;z-index:4;width:40px;height:40px;display:grid;place-items:center;
  border-radius:10px;color:#cbd6e2;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);
  transition:background .2s ease,color .2s ease;
}
.bio__close:hover{background:rgba(255,255,255,.14);color:#fff}
.bio__close svg{width:20px;height:20px}

.bio__head{
  display:flex;gap:18px;align-items:center;flex:0 0 auto;
  padding:26px clamp(20px,3vw,36px) 20px;border-bottom:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg,rgba(27,86,136,.18),rgba(27,86,136,0));
}
.bio__photo{width:92px;height:92px;flex:0 0 auto;border-radius:13px;object-fit:cover;object-position:center 25%;border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 28px rgba(0,0,0,.42)}
.bio__head-txt{min-width:0}
.bio__eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.3px;font-size:11.5px;color:#9db9d0}
.bio__eyebrow-seal{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;color:#fff;background:linear-gradient(140deg,var(--yellow),var(--yellow-2));flex:0 0 auto}
.bio__eyebrow-seal svg{width:13px;height:13px}
.bio__title{font-family:'Anton',sans-serif;text-transform:uppercase;letter-spacing:.5px;font-size:clamp(26px,3.4vw,38px);color:#fff;line-height:1;margin:9px 0 6px}
.bio__lead{font-family:'Oswald',sans-serif;font-weight:500;font-size:clamp(14px,1.5vw,17px);letter-spacing:.3px;color:#c9d6e2}

.bio__body{padding:22px clamp(20px,3vw,36px);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.bio__body>div{max-width:70ch;margin-inline:auto}   /* pohodlná šířka řádku pro čtení */
.bio__body p{font-size:clamp(14.5px,1.1vw,16px);line-height:1.72;color:#d4dbe3;margin-bottom:14px}
.bio__body p:last-child{margin-bottom:0}
.bio__body::-webkit-scrollbar{width:10px}
.bio__body::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}
.bio__body::-webkit-scrollbar-thumb{background:rgba(27,86,136,.6);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
.bio__body{scrollbar-width:thin;scrollbar-color:rgba(27,86,136,.7) rgba(255,255,255,.05)}

.bio__foot{display:flex;gap:12px;flex-wrap:wrap;flex:0 0 auto;padding:18px clamp(20px,3vw,36px);border-top:1px solid rgba(255,255,255,.1);background:rgba(9,14,21,.6)}
.bio__foot .btn{flex:1 1 auto;justify-content:center;min-width:180px}

/* Responzivní přepínání textu: dlouhá (desktop) vs krátká (mobil) */
.bio--short{display:none}
@media (max-width:768px){
  .bio--full{display:none}
  .bio--short{display:block}
  .bio__dialog{max-height:92vh;border-radius:13px}
  .bio__head{gap:14px;padding:22px 18px 16px}
  .bio__photo{width:64px;height:64px;border-radius:11px}
  .bio__foot{position:sticky;bottom:0}
  .bio__foot .btn{flex:1 1 100%}
}
/* Omezit pohyb – bez animací */
@media (prefers-reduced-motion:reduce){
  .bio__backdrop,.bio__dialog{animation:none;opacity:1;transform:none}
}

/* =====================================================================
   ===  O NÁS – autorská karta s fotkou Lukáše Anděla (várka 6) =======
   Portrét + jméno/role + odkaz na profil. Tmavá sekce (#o-nas).
   ===================================================================== */
.onas-author{
  display:flex;align-items:center;gap:18px;margin:22px 0 26px;padding:16px 18px;
  border:1px solid rgba(255,255,255,.12);border-left:3px solid var(--yellow);border-radius:14px;
  background:linear-gradient(135deg,rgba(27,86,136,.16),rgba(27,86,136,.04));
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.onas-author__photo{
  width:84px;height:84px;flex:0 0 auto;border-radius:12px;object-fit:cover;object-position:center 22%;
  border:1px solid rgba(255,255,255,.2);box-shadow:0 10px 24px rgba(0,0,0,.4);
}
.onas-author__cap{display:flex;flex-direction:column;gap:3px;min-width:0}
.onas-author__name{font-family:'Anton',sans-serif;text-transform:uppercase;letter-spacing:.6px;font-size:22px;color:#fff;line-height:1}
.onas-author__role{font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.4px;color:#a9c6df;line-height:1.35}
.onas-author__link{
  align-self:flex-start;margin-top:6px;display:inline-flex;align-items:center;gap:5px;cursor:pointer;
  font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.4px;font-size:12px;font-weight:600;
  color:#dcebf7;background:rgba(27,86,136,.34);border:1px solid rgba(146,185,220,.4);
  padding:7px 13px;border-radius:999px;transition:background .22s ease,border-color .22s ease,color .22s ease;
}
.onas-author__link svg{width:13px;height:13px;transition:transform .22s ease}
.onas-author__link:hover{background:var(--yellow);border-color:var(--yellow);color:#fff}
.onas-author__link:hover svg{transform:translateX(3px)}
@media (max-width:560px){
  .onas-author{flex-direction:row;gap:14px;padding:14px}
  .onas-author__photo{width:66px;height:66px}
  .onas-author__name{font-size:19px}
  .onas-author__role{font-size:12px}
}

/* =====================================================================
   ===  PREMIUM v2 (várka 7) – tmavý rytmus, prémiové boxy, wow ========
   Aditivní vrstva: přidává tmavé prémiové pasáže, prosklené karty,
   doladění recenzního slideru a jemné scroll-reveal. Nic nepřepisuje
   destruktivně; jen zvyšuje kontrast, hloubku a „prémiovost".
   ===================================================================== */

/* --- 2) #pro-koho → prémiová TMAVÁ sekce s prosklenými kartami ------- */
#pro-koho{position:relative;overflow:hidden;
  background:
    radial-gradient(110% 120% at 85% -10%, rgba(27,86,136,.28) 0%, transparent 52%),
    linear-gradient(180deg,#0c1421 0%,#0a1019 100%) !important;
  color:#e7edf4 !important}
#pro-koho > .container{position:relative;z-index:1}
#pro-koho .eyebrow--yellow{color:#8fbfe6 !important}
#pro-koho .h2{color:#fff !important}
#pro-koho .lead{color:#b7c4d3 !important}
#pro-koho .refs{border-top:none !important}
#pro-koho .ref{
  background:linear-gradient(160deg,rgba(23,34,52,.74),rgba(13,20,32,.62)) !important;
  border:1px solid rgba(255,255,255,.09) !important;border-radius:15px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 24px 48px -24px rgba(0,0,0,.85) !important;
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
#pro-koho .ref::after{background:linear-gradient(90deg,#2f83c4,#9fd0f4) !important;width:52px !important}
#pro-koho .ref::before{color:#7cb4e2 !important;opacity:1 !important;text-shadow:0 0 24px rgba(47,131,196,.55)}
#pro-koho .ref__name{color:#fff !important}
#pro-koho .ref__tag{color:#93a4b6 !important}
#pro-koho .ref:hover{transform:translateY(-6px) !important;
  border-color:rgba(127,176,216,.5) !important;background:linear-gradient(160deg,rgba(29,43,66,.9),rgba(15,23,37,.72)) !important;
  box-shadow:0 32px 62px -26px rgba(0,0,0,.9),0 0 0 1px rgba(47,131,196,.28) !important}
#pro-koho .ref:hover::before{color:#b6dcfb !important}

/* --- 3) Recenzní slider – prémiové doladění (box je tmavý) ---------- */
.revslider__viewport{border-radius:16px !important;
  box-shadow:0 34px 74px -34px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.05) !important;
  position:relative}
.revslider__viewport::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;border-radius:16px;
  background:radial-gradient(90% 120% at 100% 0%,rgba(47,131,196,.16),transparent 55%)}
.revslide__quote::before{opacity:.55 !important}

/* --- 4) Herostats – jemná záře pro „wow" hned pod herem ------------- */
.herostats{position:relative;overflow:hidden}
.herostats::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(80% 130% at 6% 0%,rgba(27,86,136,.26),transparent 52%)}
.herostats__inner{position:relative;z-index:1}

/* --- 5) Scroll-reveal (bezpečné: bez JS zůstává vše viditelné) ------ */
.reveal{opacity:0;transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important;transform:none !important;transition:none !important}
  .wowband__line span{animation:none;width:100%;background:linear-gradient(90deg,transparent,#2f83c4,transparent)}
}

/* =====================================================================
   ===  O NÁS – „founders" rotátor (Lukáš / Michal) + prémiový popis ==
   Nahrazuje statické logo střídáním fotek zakladatelů. Vlastní čisté
   třídy (nezávislé na starém .onas-rot), crossfade, popisek se scrim
   gradientem, tečky pro přepínání, jemný ken-burns. (várka 8)
   ===================================================================== */
.founders{position:relative;overflow:hidden;padding:0;isolation:isolate;
  width:100%;aspect-ratio:5/6;min-height:0 !important;height:auto;
  align-self:stretch;max-width:460px;margin-inline:auto;
  background:#0a1321 !important;
  border:1px solid rgba(255,255,255,.10) !important;border-radius:16px !important;
  box-shadow:0 34px 70px -28px rgba(11,18,30,.6),inset 0 0 0 1px rgba(255,255,255,.05) !important}
.founders__slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;
  transition:opacity .8s cubic-bezier(.22,.61,.36,1)}
.founders__slide.is-active{opacity:1;visibility:visible}
.founders__img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;
  transform:scale(1.02);transition:transform 7s ease}
.founders__slide.is-active .founders__img{transform:scale(1.10)}
.founders__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:30px 24px 22px;display:flex;flex-direction:column;gap:4px;
  background:linear-gradient(to top,rgba(6,10,16,.94) 0%,rgba(6,10,16,.72) 42%,rgba(6,10,16,.12) 78%,transparent 100%)}
.founders__role{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:2px;
  font-size:11.5px;font-weight:500;color:#8fbfe6}
.founders__name{font-family:'Anton',sans-serif;text-transform:uppercase;letter-spacing:.6px;
  font-size:clamp(22px,2.5vw,31px);color:#fff;line-height:1;text-shadow:0 2px 16px rgba(0,0,0,.6)}
.founders__desc{font-family:'Inter',sans-serif;font-size:13px;line-height:1.5;color:#cfd9e5;
  margin-top:4px;max-width:38ch}
.founders__dots{position:absolute;top:14px;right:14px;z-index:3;display:flex;gap:7px}
.founders__dot{width:9px;height:9px;border-radius:50%;padding:0;cursor:pointer;
  background:rgba(255,255,255,.35);border:1px solid rgba(255,255,255,.55);
  transition:background .25s ease,transform .25s ease}
.founders__dot.is-active{background:var(--yellow);border-color:var(--yellow);transform:scale(1.15)}
.founders__dot:hover{background:rgba(255,255,255,.75)}
.founders__dot:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  .founders__slide{transition:opacity .01s linear}
  .founders__img,.founders__slide.is-active .founders__img{transition:none;transform:none}
}

/* =====================================================================
   ===  PREMIUM v3 (várka 9) – povýšení SVĚTLÝCH sekcí a karet ========
   Diagnóza: světlé karty byly ploché (ostré/nulové rohy, bez hloubky,
   chudý hover) → působily obyčejně. Přenáším prémiovou DNA tmavých
   karet do světlé varianty: měkké vrstvené stíny, hairline rámeček,
   akcentový proužek u číslovaných, plovoucí hover. + jemné „plátno"
   pod sekcemi, aby bílé karty vynikly.
   ===================================================================== */

/* Jemné plátno pod světlými sekcemi – bílé karty pak „vyskočí" */
#sluzby,#vykon,#proc,#bezpecnost,#prubeh,#o-nas,#reference,#faq,#kontakt{
  background:
    radial-gradient(90% 60% at 100% 0%, rgba(27,86,136,.055), transparent 58%),
    linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%) !important;
}

/* Prémiové světlé karty – měkká hloubka, hairline rámeček, plovoucí hover */
.feat,.kb-sum__item,.steps li,.contact__card{
  border-radius:16px !important;
  border:1px solid #e6eaf1 !important;
  background:linear-gradient(180deg,#ffffff 0%,#f5f8fc 100%) !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 16px 34px -16px rgba(16,24,40,.22) !important;
  transition:transform .32s cubic-bezier(.22,.61,.36,1),box-shadow .32s ease,border-color .32s ease !important;
}
.feat:hover,.kb-sum__item:hover,.steps li:hover,.contact__card:hover{
  transform:translateY(-6px) !important;
  border-color:rgba(27,86,136,.4) !important;
}
/* Nečíslované karty – bohatší hover stín */
.kb-sum__item:hover,.contact__card:hover{
  box-shadow:0 4px 10px rgba(16,24,40,.06),0 30px 56px -20px rgba(16,24,40,.30) !important;
}
/* Číslované karty (proc, kroky) – akcentový horní proužek (inset, bez konfliktu s pseudo) */
.feat,.steps li{
  box-shadow:inset 0 3px 0 var(--yellow),0 1px 2px rgba(16,24,40,.04),0 16px 34px -16px rgba(16,24,40,.22) !important;
}
.feat:hover,.steps li:hover{
  box-shadow:inset 0 3px 0 var(--yellow),0 4px 10px rgba(16,24,40,.06),0 30px 56px -20px rgba(16,24,40,.30) !important;
}
/* Doplnění paddingu tam, kde chybělo (karta potřebuje vnitřní prostor) */
.kb-sum__item{padding:22px 22px !important}
.steps li{padding:28px 22px !important}
/* Čísla – jemná hloubka na světlém podkladu */
.feat__num,.steps li span{text-shadow:0 1px 0 rgba(255,255,255,.7)}

/* =====================================================================
   ===  KONTINUITA v1 (várka 10) – sjednocení barev a hierarchie ======
   Audit odhalil roztříštěnost: nadpisy ve 3 odstínech (navy / šedá /
   černá), eyebrow ve 2 modrých (#195080 vs #134266), fotorámy 2px vs
   16px karty, tlačítka ostrá 3px. Sjednocuji do jasné hierarchie:
   nadpis = navy ink #16202E, akcent = #1B5688, tělo = šedá.
   ===================================================================== */

/* Jednotná barva nadpisů na světlých sekcích (navy ink) */
#sluzby .h2,#vykon .h2,#bezpecnost .h2,#proc .h2,#prubeh .h2,
#o-nas .h2,#reference .h2,#cenik .h2,#faq .h2,#kontakt .h2{ color:#16202e !important; }

/* Jednotný akcent eyebrow na světlých sekcích (primární #1B5688) */
#sluzby .eyebrow,#vykon .eyebrow,#bezpecnost .eyebrow,#proc .eyebrow,#prubeh .eyebrow,
#o-nas .eyebrow,#reference .eyebrow,#cenik .eyebrow,#faq .eyebrow,#kontakt .eyebrow{ color:#1b5688 !important; }
#sluzby .eyebrow--yellow::before,#vykon .eyebrow--yellow::before,#bezpecnost .eyebrow--yellow::before,
#proc .eyebrow--yellow::before,#prubeh .eyebrow--yellow::before,#o-nas .eyebrow--yellow::before,
#reference .eyebrow--yellow::before,#cenik .eyebrow--yellow::before,#faq .eyebrow--yellow::before,
#kontakt .eyebrow--yellow::before{ background:#1b5688 !important; }

/* Jednotné zaoblení fotorámů (kontinuita s kartami 16px) */
.split__media{ border-radius:16px !important; }

/* Tlačítka – jemně zaoblenější (3px → 8px) pro návaznost na karty */
.btn{ border-radius:8px !important; }

/* =====================================================================
   ===  PREMIUM v4 (várka 11) – Reference tmavá + galerie/ceník + rytmus
   1) #reference → prémiová tmavá (slider už tmavý, .client do dark-glass)
   2) galerie služeb + ceníkový note do prémiové DNA
   3) jemné oddělovače sekcí + sjednocení hoverů
   ===================================================================== */

/* ---- 1) REFERENCE → prémiová tmavá ---- */
#reference{position:relative;overflow:hidden;
  background:
    radial-gradient(110% 120% at 85% -10%, rgba(27,86,136,.28) 0%, transparent 52%),
    linear-gradient(180deg,#0c1421 0%,#0a1019 100%) !important;
  color:#e7edf4 !important}
#reference>.container{position:relative;z-index:1}
#reference .eyebrow{color:#8fbfe6 !important}
#reference .eyebrow--yellow::before{background:#8fbfe6 !important}
#reference .h2{color:#fff !important}
#reference .lead{color:#b7c4d3 !important}
#reference .lead a{color:#9fd0f4 !important}
#reference .clients__label{color:#e7edf4 !important}
#reference .clients-m__intro,#reference .clients-m__text{color:#b7c4d3 !important}
#reference .clients-m__intro strong,#reference .clients-m__text strong{color:#fff !important}
/* recenzní slider – panel odlišit od tmavé sekce */
#reference .revslider__viewport{
  background:linear-gradient(160deg,rgba(21,33,53,.66),rgba(10,17,28,.72)) !important}
#reference .revslide__meta a{color:#9fd0f4 !important}
/* .client accordiony → dark-glass karty */
#reference .client{
  background:linear-gradient(160deg,rgba(23,34,52,.74),rgba(13,20,32,.62)) !important;
  border:1px solid rgba(255,255,255,.09) !important;border-radius:14px !important;
  box-shadow:0 18px 40px -20px rgba(0,0,0,.8) !important;color:#c3d1df !important;
  transition:border-color .28s ease,box-shadow .28s ease !important}
#reference .client:hover{border-color:rgba(127,176,216,.5) !important;
  box-shadow:0 24px 50px -22px rgba(0,0,0,.9),0 0 0 1px rgba(47,131,196,.22) !important}
#reference .client summary{color:#fff !important}
#reference .client--featured{border-color:rgba(47,131,196,.45) !important}
#reference .client__spec,#reference .client__detail,#reference .client__detail p,
#reference .client__detail li{color:#b7c4d3 !important}
#reference .client a{color:#9fd0f4 !important}
#reference .clients__lf{color:#8fbfe6 !important}

/* ---- 2a) Galerie služeb – prémiové zarámování ---- */
.svc__stage{border-radius:16px !important;overflow:hidden;
  border:1px solid #e6eaf1 !important;
  box-shadow:0 30px 64px -30px rgba(16,24,40,.42) !important}
.svc__slide{border-radius:16px !important}
.svc__nav{box-shadow:0 8px 20px rgba(16,24,40,.18) !important}

/* ---- 2b) Ceník – „note--premium" do prémiové DNA + rám ---- */
.note--premium{border-radius:16px !important;border:1px solid #e6eaf1 !important;
  background:linear-gradient(180deg,#ffffff 0%,#f5f8fc 100%) !important;
  box-shadow:inset 0 3px 0 var(--yellow),0 16px 34px -16px rgba(16,24,40,.22) !important}
.cenik__media-frame{border-radius:16px !important}

/* ---- 3) Jemné oddělovače světlých sekcí (rytmus/ostrost) ---- */
#sluzby,#vykon,#bezpecnost,#proc,#prubeh,#o-nas,#cenik,#faq,#kontakt{
  border-top:1px solid rgba(16,24,40,.06)}

/* =====================================================================
   ===  REFERENCE – rozdělení (várka 12) ==============================
   Horní část „Hodnocení zákazníků" = SVĚTLÁ (recenzní slider zůstává
   tmavý box jako panel). Spodní blok „Vybraní zákazníci a realizace"
   = TMAVÝ panel s dark-glass kartami. Tlačítko „Zobrazit více realizací"
   ztmaveno (nesmí být bílé na tmavém).
   ===================================================================== */

/* Sekce zpět do světlé + horní nadpisy tmavé (přebíjí várku 11) */
#reference{
  background:
    radial-gradient(90% 60% at 100% 0%, rgba(27,86,136,.055), transparent 58%),
    linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%) !important;
}
#reference .eyebrow{color:#1b5688 !important}
#reference .eyebrow--yellow::before{background:#1b5688 !important}
#reference .h2{color:#16202e !important}
#reference .lead{color:#46505a !important}
#reference .lead a{color:#1b5688 !important}

/* Spodní blok = tmavý panel */
#reference .clients{
  position:relative; overflow:hidden;
  margin-top:44px;
  padding:clamp(26px,3vw,44px) clamp(20px,3vw,40px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  background:linear-gradient(180deg,#0c1421 0%,#0a1019 100%) !important;
  box-shadow:0 34px 74px -34px rgba(0,0,0,.6);
}
#reference .clients::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(90% 100% at 90% 0%, rgba(27,86,136,.22), transparent 55%);
}
#reference .clients>*{position:relative; z-index:1}
#reference .clients__label{color:#fff !important}
#reference .clients-m__intro,#reference .clients-m__text{color:#b7c4d3 !important}
#reference .clients-m__intro strong,#reference .clients-m__text strong{color:#fff !important}

/* Tlačítko „Zobrazit více realizací" = tmavé (dark-glass, jako karty) */
#reference .btn-more{
  background:linear-gradient(160deg,rgba(23,34,52,.82),rgba(13,20,32,.7)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  color:#e7edf4 !important; border-radius:16px !important;
  box-shadow:0 18px 40px -20px rgba(0,0,0,.85) !important;
  transition:border-color .28s ease, background .28s ease, transform .28s ease !important;
}
#reference .btn-more:hover{
  transform:translateY(-4px) !important;
  border-color:rgba(127,176,216,.5) !important;
  background:linear-gradient(160deg,rgba(29,43,66,.92),rgba(15,23,37,.76)) !important;
}
#reference .btn-more__label{color:#fff !important}
#reference .btn-more__chev{color:#8fbfe6 !important}

/* =====================================================================
   ===  várka 13 – #vykon tmavá, recenzní box navy, #proc karty tmavé =
   ===================================================================== */

/* ---- 1) #vykon „S čím vším vám v Táboře pomůžeme" = TMAVÁ ---- */
#vykon{position:relative;overflow:hidden;
  background:
    radial-gradient(110% 120% at 85% -10%, rgba(27,86,136,.28) 0%, transparent 52%),
    linear-gradient(180deg,#0c1421 0%,#0a1019 100%) !important;
  color:#e7edf4 !important;border-top:1px solid rgba(255,255,255,.06) !important}
#vykon .eyebrow{color:#8fbfe6 !important}
#vykon .eyebrow--yellow::before{background:#8fbfe6 !important}
#vykon .h2{color:#fff !important}
#vykon .kb-sum__lead{color:#b7c4d3 !important}
#vykon .kb-sum__item{
  background:linear-gradient(160deg,rgba(23,34,52,.74),rgba(13,20,32,.62)) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  box-shadow:0 22px 46px -22px rgba(0,0,0,.8) !important}
#vykon .kb-sum__item:hover{transform:translateY(-6px) !important;border-color:rgba(127,176,216,.5) !important}
#vykon .kb-sum__title{color:#fff !important}
#vykon .kb-sum__desc{color:#9fb0c2 !important}
#vykon .kb-sum__ico{color:#8fbfe6 !important}
#vykon .kb-sum__ctatext{color:#b7c4d3 !important}
#vykon .kb-sum__ctatext strong{color:#fff !important}

/* ---- 2) Recenzní box – jednotná navy (ať zapadá do webu) ---- */
#reference .revslider__viewport{
  background:linear-gradient(155deg,#13223a 0%,#0b1322 60%,#0a1119 100%) !important}

/* ---- 3) #proc „Výhody…" – karty jako tmavé dlaždice na světlé sekci ---- */
#proc .feat{
  background:linear-gradient(160deg,#152238 0%,#0e1626 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:inset 0 3px 0 var(--yellow),0 22px 46px -20px rgba(16,24,40,.5) !important}
#proc .feat:hover{transform:translateY(-6px) !important;border-color:rgba(127,176,216,.45) !important;
  box-shadow:inset 0 3px 0 var(--yellow),0 32px 58px -22px rgba(16,24,40,.6) !important}
#proc .feat__num{color:#7cb4e2 !important;text-shadow:0 0 22px rgba(47,131,196,.5)}
#proc .feat h3{color:#fff !important}
#proc .feat p{color:#a9b8c8 !important}

/* =====================================================================
   ===  várka 14 – recenzní box = vizuálně shodný s panelem realizací =
   Sjednoceno 1:1: pozadí, rámeček, rádius, stín i rohová záře.
   Doladěn obsah (hvězdičky, badge, jméno, popis, odkaz) na stejné tóny.
   ===================================================================== */
#reference .revslider__viewport{
  background:linear-gradient(180deg,#0c1421 0%,#0a1019 100%) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-left:1px solid rgba(255,255,255,.08) !important;  /* zrušení žlutého pruhu */
  border-radius:20px !important;
  box-shadow:0 34px 74px -34px rgba(0,0,0,.6) !important;
}
/* stejná rohová záře jako u panelu realizací */
#reference .revslider__viewport::before{
  border-radius:20px !important;
  background:radial-gradient(90% 100% at 90% 0%, rgba(27,86,136,.22), transparent 55%) !important;
}
/* obsah – stejné tóny jako v kartách realizací */
#reference .revslide__quote{color:#e7edf4 !important}
#reference .revslide__quote::before{color:#7cb4e2 !important;opacity:.5 !important}
#reference .revslide__score{color:#8fbfe6 !important;border-color:rgba(127,176,216,.35) !important;
  background:rgba(27,86,136,.16) !important}
#reference .revstars{color:#7cb4e2 !important;-webkit-text-stroke:0 !important;
  text-shadow:0 0 18px rgba(47,131,196,.45) !important}
#reference .revslide__meta{color:#b7c4d3 !important}
#reference .revslide__meta strong{color:#fff !important}
#reference .revslide__meta span{color:#93a4b6 !important}
#reference .revslide__meta a{color:#9fd0f4 !important;border-bottom-color:rgba(159,208,244,.45) !important}

/* =====================================================================
   ===  várka 15 – POPTÁVKA tmavě prémiově + čitelnost tmavého materiálu
   1) #poptavka: modrý pás + bílá karta → tmavá prémiová sekce s dark-glass
      formulářem (stejná DNA jako panel realizací).
   2) Kontrastní audit odhalil nečitelné texty na tmavém podkladu:
      - .client .cn-d/.cn-m měly #141d2b (poměr 1.09!) → světlé
      - sektorové chipy #1B5688 na tmavém → světle modré
      - pořadová čísla referencí (opacity .13) → viditelnější
      - hvězdičky, patička (adslot) → zvýšený kontrast
   ===================================================================== */

/* ---- 1) POPTÁVKA = tmavá prémiová sekce ---- */
#poptavka{
  background:
    radial-gradient(110% 120% at 85% -10%, rgba(27,86,136,.30) 0%, transparent 52%),
    linear-gradient(180deg,#0c1421 0%,#0a1019 100%) !important;
  color:#e7edf4 !important}
#poptavka .eyebrow{color:#8fbfe6 !important}
#poptavka .eyebrow--yellow::before{background:#8fbfe6 !important}
#poptavka .h2{color:#fff !important}
#poptavka .lead{color:#c3d1df !important}
#poptavka .lead a{color:#9fd0f4 !important}
/* formulářová karta – dark glass */
#poptavka .form{
  background:linear-gradient(160deg,rgba(23,34,52,.86),rgba(13,20,32,.78)) !important;
  border:1px solid rgba(255,255,255,.10) !important;border-radius:20px !important;
  box-shadow:0 34px 74px -34px rgba(0,0,0,.75) !important}
#poptavka label{color:#8fbfe6 !important}
#poptavka input,#poptavka select,#poptavka textarea{
  background:rgba(9,15,25,.72) !important;color:#eef4fa !important;
  border:1px solid rgba(255,255,255,.14) !important;border-radius:12px !important;
  transition:border-color .25s ease,box-shadow .25s ease,background .25s ease !important}
#poptavka input::placeholder,#poptavka textarea::placeholder{color:#8d9dae !important;opacity:1}
#poptavka input:focus,#poptavka select:focus,#poptavka textarea:focus{
  border-color:rgba(127,176,216,.75) !important;background:rgba(12,20,33,.9) !important;
  box-shadow:0 0 0 3px rgba(47,131,196,.22) !important;outline:none !important}
#poptavka select option{background:#0f1826;color:#eef4fa}
#poptavka .check,#poptavka .check *{color:#b7c4d3 !important}
#poptavka .check a{color:#9fd0f4 !important}
#poptavka .reassure,#poptavka .small,#poptavka .muted{color:#93a4b6 !important}
/* odesílací tlačítko – stejná barva jako .btn--primary všude jinde na webu.
   (Původní bílá pocházela z modré CTA sekce; po ztmavení sem nezapadala.) */
#poptavka .btn--primary,#poptavka.section--cta .btn--primary{
  background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(159,208,244,.28) !important;
  box-shadow:0 2px 6px rgba(27,86,136,.26),0 12px 24px -8px rgba(27,86,136,.42),inset 0 1px 0 rgba(255,255,255,.16) !important}
#poptavka .btn--primary:hover,#poptavka.section--cta .btn--primary:hover{
  background:linear-gradient(180deg,#2a76b0 0%,#184b78 100%) !important;
  color:#ffffff !important;
  box-shadow:0 4px 10px rgba(27,86,136,.32),0 18px 34px -10px rgba(27,86,136,.5),inset 0 1px 0 rgba(255,255,255,.18) !important}

/* ---- 2) ČITELNOST tmavého materiálu ---- */
/* názvy referencí (byly #141d2b – prakticky neviditelné) */
#reference .clients .client .cn-d,
#reference .clients .client .cn-m{color:#ffffff !important}
#reference .clients .client .clients__lf{color:#9fb0c2 !important}
/* sektorové chipy – světle modré na tmavém */
#reference .clients .client > summary::before{
  color:#9fd0f4 !important;
  background:rgba(47,131,196,.18) !important;
  border-color:rgba(127,176,216,.42) !important}
#reference .clients .client--featured > summary::before{
  color:#ffffff !important;
  background:linear-gradient(95deg,#1b5688,#2f83c4) !important;
  border-color:rgba(159,208,244,.5) !important}
/* velká pořadová čísla – viditelná, ale nerušivá */
#reference .clients .client::before,
#reference .clients .client--extra::before{color:rgba(127,176,216,.28) !important}
/* popisy a specifika v kartách */
#reference .clients .client__detail p{color:#c3d1df !important}
#reference .clients .client__spec{color:#a9b8c8 !important}
/* hvězdičky v recenzi – vyšší kontrast */
#reference .revstars{color:#9fd0f4 !important}
/* patička – zvýšení čitelnosti drobných textů */
footer .adslot__title{color:#ffffff !important}
footer .adslot__desc{color:#b7c4d3 !important}
footer .adslot__tag{color:#9fb0c2 !important}
/* doladění: zvýrazněné pasáže v poptávce (byly tmavě modré na tmavém) */
#poptavka .reassure strong,#poptavka .small strong,#poptavka .muted strong,
#poptavka .check strong,#poptavka p strong{color:#9fd0f4 !important}
/* doladění: nadpisy a popisy uvnitř karet #vykon (plain h3/p) */
#vykon h3{color:#ffffff !important}
#vykon p{color:#b7c4d3 !important}
#vykon .kb-sum__item h3{color:#ffffff !important}
#vykon .kb-sum__item p{color:#a9b8c8 !important}

/* =====================================================================
   ===  COOKIES – mikro oznámení o souhlasu (várka 16) ================
   Minimalistický prémiový panel: poloprůhledný dark-glass, jemné
   rozostření, decentní okraj a měkký stín. Dvě rovnocenná tlačítka.
   Desktop: kompaktní plovoucí panel vlevo dole (ne přes celou šířku).
   Mobil: nad fixní CTA lištou (.sticky-bar), aby ji nezakryl.
   ===================================================================== */
.cc{
  position:fixed; z-index:70;               /* nad .sticky-bar (60), pod modály */
  left:clamp(16px,2.2vw,28px); bottom:clamp(16px,2.2vw,28px);
  width:min(560px,calc(100vw - 32px));
  display:flex; align-items:center; gap:14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:linear-gradient(160deg,rgba(16,25,41,.82),rgba(10,16,27,.78));
  -webkit-backdrop-filter:blur(12px) saturate(1.1);
  backdrop-filter:blur(12px) saturate(1.1);
  box-shadow:0 18px 44px -18px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06);
  animation:ccIn .4s cubic-bezier(.22,.61,.36,1) both;
}
.cc[hidden]{display:none}
.cc__text{
  margin:0; flex:1 1 auto; min-width:0;
  font-family:'Inter',sans-serif; font-size:12.5px; line-height:1.45;
  color:#c6d3e0; letter-spacing:.1px;
}
.cc__actions{display:flex; gap:8px; flex:0 0 auto}
/* Obě tlačítka záměrně stejná velikost i váha – žádné zvýhodnění souhlasu */
.cc__btn{
  font-family:'Oswald',sans-serif; text-transform:uppercase;
  font-size:11.5px; letter-spacing:1.2px; font-weight:500;
  color:#e7edf4; cursor:pointer;
  padding:9px 14px; width:116px; min-height:38px; text-align:center;
  border:1px solid rgba(255,255,255,.22); border-radius:9px;
  background:rgba(255,255,255,.06);
  transition:background .22s ease,border-color .22s ease,transform .22s ease;
}
.cc__btn:hover{background:rgba(255,255,255,.12); border-color:rgba(159,208,244,.55)}
.cc__btn:active{transform:translateY(1px)}
.cc__btn:focus-visible{outline:2px solid #9fd0f4; outline-offset:2px}
@keyframes ccIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* --- Mobil: nad fixní CTA lištou, plná šířka s malým odsazením --- */
@media (max-width:680px){
  .cc{
    left:12px; right:12px; width:auto;
    /* .sticky-bar: bottom 16px + výška 56px → posadit nad ni + safe-area */
    bottom:calc(84px + env(safe-area-inset-bottom,0px));
    flex-wrap:wrap; gap:10px; padding:12px 13px; border-radius:13px;
  }
  .cc__text{flex:1 1 100%; font-size:12px}
  .cc__actions{flex:1 1 100%; gap:8px}
  .cc__btn{flex:1 1 0; width:auto; min-width:0; min-height:42px; font-size:11px}  /* dotyková plocha */
}
/* Velmi úzké displeje – tlačítka pod sebe */
@media (max-width:340px){
  .cc__actions{flex-wrap:wrap}
  .cc__btn{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){ .cc{animation:none} }

/* --- Odkaz „Nastavení cookies" v patičce – nenápadný --- */
.footer__cookies{
  display:inline-block; margin-left:14px; padding:0;
  font-family:'Inter',sans-serif; font-size:inherit; line-height:inherit;
  color:inherit; opacity:.72; cursor:pointer;
  background:none; border:0; border-bottom:1px solid currentColor;
  transition:opacity .2s ease;
}
.footer__cookies:hover{opacity:1}
.footer__cookies:focus-visible{outline:2px solid #9fd0f4; outline-offset:2px}
@media (max-width:680px){ .footer__cookies{display:block; margin:8px 0 0} }

/* =====================================================================
   ===  AUDIT FIX (várka 17) – konzistence a čitelnost =================
   Opraveno na základě pixelového auditu kontrastu (WCAG AA) napříč
   celým webem, desktop i mobil. Hlavní příčina hlášených „neviditelných
   textů": sekce #vykon byla ztmavena, ale karty .kb article zůstaly
   bílé → bílý nadpis na bílé kartě. Sjednoceno do jedné tmavé DNA.
   ===================================================================== */

/* --- 1) #vykon: karty do stejné tmavé DNA jako ostatní tmavé karty --- */
#vykon .kb article{
  background:linear-gradient(160deg,rgba(23,34,52,.74),rgba(13,20,32,.62)) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  border-left:1px solid rgba(255,255,255,.09) !important;
  border-radius:16px !important;
  box-shadow:0 22px 46px -22px rgba(0,0,0,.8) !important;
  transition:transform .3s cubic-bezier(.22,.61,.36,1),border-color .3s ease,box-shadow .3s ease !important;
}
#vykon .kb article:hover{
  background:linear-gradient(160deg,rgba(29,43,66,.9),rgba(15,23,37,.72)) !important;
  border-color:rgba(127,176,216,.5) !important;
  transform:translateY(-6px) !important;
  box-shadow:0 32px 58px -24px rgba(0,0,0,.9) !important;
}
#vykon .kb article h3{color:#ffffff !important}
#vykon .kb article p{color:#a9b8c8 !important}
#vykon .kb article::before{border-color:#2f83c4 transparent transparent transparent !important}

/* --- 2) #vykon: souhrnný blok a jeho CTA (byl světlý na mobilu) --- */
#vykon .kb-sum__cta{
  background:linear-gradient(160deg,rgba(23,34,52,.74),rgba(13,20,32,.62)) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  box-shadow:0 22px 46px -22px rgba(0,0,0,.8) !important;
}
#vykon .kb-sum__ctatext{color:#c3d1df !important}
#vykon .kb-sum__lead strong,#vykon strong{color:#9fd0f4 !important}

/* --- 3) Patička: čitelnost drobných prvků --- */
.footer__cookies{color:#b7c4d3 !important; opacity:1}
.footer__cookies:hover{color:#ffffff !important}
.adslot__cta{background:#0f5cc0 !important; color:#ffffff !important}
.adslot__desc{color:#e8eef5 !important}

/* --- 4) Poptávka: zvýrazněné pasáže na tmavé kartě --- */
#poptavka .reassure{color:#c3d1df !important}
#poptavka .reassure strong,#poptavka .form strong{color:#ffffff !important}

/* --- 5) Kontakt: popisky (byly příliš světlé na bílé) --- */
.contact__label{color:#5a636e !important}

/* --- 6) Odkaz na firemní profil na světlém podkladu --- */
.poptavej-inline{color:#103a5c !important}

/* --- 7) Popisek nad fotkou v galerii – silnější scrim (mobil) --- */
.svc__caption{text-shadow:0 2px 16px rgba(0,0,0,.85),0 1px 3px rgba(0,0,0,.9) !important}
.svc__stage .svc__caption{
  background:linear-gradient(to top,rgba(4,8,14,.92) 0%,rgba(4,8,14,.72) 45%,rgba(4,8,14,.18) 78%,transparent 100%) !important;
}

/* --- 8) Řádek s odkazem na oficiální web (tmavý podklad) --- */
.sn-line{color:#9fb0c2 !important}

/* --- AUDIT FIX 2 (várka 17b) – doladění dle opakovaného auditu ------- */
/* specificita: dřívější pravidla přebíjela opravy */
footer .adslot__desc{color:#e8eef5 !important}
#reference .lead a.poptavej-inline,.poptavej-inline{color:#103a5c !important}
/* .sn-line je na SVĚTLÉM pruhu – vrátit tmavý čitelný tón */
.sn-line,.sitenotice__inner .sn-line{color:#46505a !important}
/* ghost tlačítko uvnitř tmavého CTA bloku v #vykon (byl tmavý text na tmavém) */
#vykon .kb-sum__cta .btn--ghost{color:#eaf2fa !important;border-color:rgba(159,208,244,.55) !important}
#vykon .kb-sum__cta .btn--ghost:hover{background:rgba(255,255,255,.08) !important}
/* popisek nad fotkou galerie – ještě silnější podklad pod textem */
.svc__stage .svc__caption{
  background:linear-gradient(to top,rgba(3,6,11,.96) 0%,rgba(3,6,11,.85) 52%,rgba(3,6,11,.3) 82%,transparent 100%) !important;
}

/* --- AUDIT FIX 3 (várka 17c) – popisek „další foto" nad fotografií ---
   Bílý text ležel na světlé části fotky (kontrast 3.3). Ztmavením
   podkladové destičky a přidáním stínu textu je čitelný na jakékoli fotce. */
.photoband__next{
  background:rgba(6,11,20,.72) !important;
  border-color:rgba(255,255,255,.38) !important;
  box-shadow:0 12px 28px -10px rgba(0,0,0,.7) !important;
}
.photoband__next-lbl{text-shadow:0 1px 6px rgba(0,0,0,.8) !important}
.photoband__next-lbl small{opacity:.95 !important}

/* --- AUDIT FIX 4 (várka 17d) – sjednocení zaoblení -------------------
   Karty napříč webem = 16px, velké panely a formuláře = 20px.
   (dříve 14px u referencí a 15px u dlaždic „Pro koho") */
#pro-koho .ref{border-radius:16px !important}
#reference .clients .client{border-radius:16px !important}

/* =====================================================================
   ===  HERO – „Prozkoumat": zkrácení svislé linky (várka 18) =========
   Linka měřila 36 px, což při drobném popisku a šipce působilo příliš
   dlouze a nevyváženě. Zkráceno na 20 px, sladěny rozestupy a dráha
   světelného bodu, aby efekt zůstal plynulý a prémiový.
   ===================================================================== */
@media (min-width:1025px){
  .hero__scrolldown{ gap:7px !important; padding:11px 22px 12px !important; }
  .hero__scrolldown__track{ height:20px !important; }
  .hero__scrolldown__dot{ animation-name:heroScrollDotShort !important; }
  .hero__scrolldown__chev{ width:11px !important; height:11px !important; margin-top:-2px !important; }
}
@keyframes heroScrollDotShort{
  0%{ transform:translateX(-50%) translateY(0); opacity:0 }
  18%{ opacity:1 }
  76%{ opacity:1 }
  100%{ transform:translateX(-50%) translateY(12px); opacity:0 }
}


/* =====================================================================
   ===  VÁRKA 19 – SJEDNOCENÍ BAREV NAPŘÍČ VŠEMI ZOBRAZENÍMI ==========
   Zdrojem pravdy je odladěná PC verze (≥1025 px). Tato vrstva promítá
   její barevnou paletu do tabletu (≤1024) i mobilu (≤768 / ≤680 / ≤600),
   opravuje barevné kolize v mobilních komponentách a nesahá na PC.
   Nepřidává ani neodebírá žádné prvky – mění výhradně jejich vzhled.

   Referenční paleta (PC):
     akcent            #1B5688     akcent hluboký    #134266
     akcent na tmavém  #73B4E6     akcent světlý     #9FD0F5
     CTA gradient      #22669C → #15426A   (hover #1F6098 → #0F3A5C)
     inkoust           #16202E     text na tmavém    #E9EAEC / #B9D2E6
     plochy            #FFFFFF     světlý pruh       #F7F9FB → #ECEFF4
     hairline světlá   #E6E9EF     tmavý podklad     #0B121E / #101929
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) HERO – fotografie: sjednocení barevného profilu
   Mobil/tablet měl filtr s brightness + SEPIA(.08) → fotka byla teplejší
   a nažloutlá, zatímco PC drží chladný tón. Sepia odstraněna, kontrast
   i sytost srovnány s PC; ponechán jen jemný jas kvůli tmavšímu ořezu.
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .hero .hero__bg{
    filter:brightness(1.08) contrast(1.04) saturate(1.05) !important;
  }
}

/* ---------------------------------------------------------------------
   2) HERO – překryv: stejný odstín jako na PC
   Mobil používal rgba(8,13,22) (studenější šeď), PC rgba(11,18,30)
   (modročerná) + jemný modrý světelný nádech. Světelný průběh (svisle)
   zůstává kvůli kompozici, mění se pouze barva.
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .hero .hero__overlay{
    background:
      radial-gradient(78% 50% at 50% 22%, rgba(150,190,232,.16), rgba(150,190,232,0) 62%),
      linear-gradient(180deg,
        rgba(11,18,30,.85) 0%, rgba(11,18,30,.62) 15%, rgba(11,18,30,.32) 30%,
        rgba(11,18,30,.08) 44%, rgba(11,18,30,0) 58%,
        rgba(11,18,30,0) 70%, rgba(11,18,30,.55) 100%) !important;
  }
}

/* ---------------------------------------------------------------------
   3) HERO – typografie: shodné odstíny s PC
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .hero .eyebrow{ color:#73B4E6 !important; }              /* bylo #8CC0EC */
  .hero .eyebrow::before{ background:#73B4E6 !important; }
  .hero h1{ text-shadow:0 4px 30px rgba(0,0,0,.5) !important; }
  .hero__city{ opacity:1 !important; }                      /* bylo .72 */
}
@media (max-width:680px){
  .hero__sub{ color:#e5e5e5 !important; }                   /* bylo #e6ebf1 */
}

/* ---------------------------------------------------------------------
   4) HERO – hlavní CTA „Zavolat nyní"
   Na mobilu bylo bílé/skleněné, na PC modré s bílým textem. Sjednoceno
   na PC gradient. Řeší i skrytou kolizi: výchozí stav dědil
   background:var(--dark-2) = #ffffff a color:#fff (bílá na bílé),
   a aktivovaný stav měl tmavý text na modré (kontrast 2,6:1).
   Nyní bílý text na modré = 6,1:1 (WCAG AA).
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .hero__cta .btn--primary,
  .hero__cta .btn--call,
  .hero__cta .btn--call.hero-call--activate,
  .hero__cta .btn--primary.hero-call--activate{
    background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.16) !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    box-shadow:0 6px 18px rgba(27,86,136,.36),0 2px 6px rgba(0,0,0,.18),
               inset 0 1px 0 rgba(255,255,255,.14) !important;
  }
  .hero__cta .btn--call .ico,
  .hero__cta .btn--primary .ico{ color:#ffffff !important; }
  .hero__cta .btn--call:hover,
  .hero__cta .btn--call:active,
  .hero__cta .btn--primary:hover,
  .hero__cta .btn--primary:active{
    background:linear-gradient(180deg,#1F6098 0%,#0F3A5C 100%) !important;
    color:#ffffff !important;
    box-shadow:0 14px 30px rgba(27,86,136,.5),0 4px 10px rgba(0,0,0,.24),
               inset 0 1px 0 rgba(255,255,255,.16) !important;
  }
}

/* ---------------------------------------------------------------------
   5) HERO – dlaždice s profilem (mobil/tablet)
   Sladěna s desktopovou lištou .hero__plate (stejné sklo i hairline).
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .hero__profile{
    background:linear-gradient(135deg,rgba(16,25,41,.74) 0%,rgba(10,16,27,.64) 100%) !important;
    border:1px solid rgba(255,255,255,.17) !important;
    border-left:3px solid #1B5688 !important;
    box-shadow:0 26px 60px rgba(0,0,0,.52),0 6px 16px rgba(0,0,0,.42),
               0 0 0 1px rgba(27,86,136,.18),inset 0 1px 0 rgba(255,255,255,.11) !important;
  }
  .hero__profile-txt span{ color:#b9d2e6 !important; }      /* bylo #a9c6df */
  .hero__profile-chev{ color:rgba(255,255,255,.74) !important; }
}

/* ---------------------------------------------------------------------
   6) HLAVIČKA – stejný stín a stejné odstíny textu jako na PC
   ------------------------------------------------------------------ */
@media (max-width:768px){
  .header{
    box-shadow:0 1px 0 rgba(16,24,40,.03),0 10px 30px -14px rgba(16,24,40,.14) !important;
  }
}
.header .logo__text span{ color:#6a7480 !important; }        /* bylo rgba(19,32,46,.62) */
@media (max-width:1024px){
  .header .nav .nav__ico{ opacity:.7 !important; }           /* bylo .85 */
  .header .nav a{ color:#13202e !important; }                /* bylo #1c2530 / #12233a */
  .header .nav a:hover{ color:#134266 !important; background:rgba(0,0,0,.07) !important; }
  .header .nav a::after{ background:#1B5688 !important; }
}

/* ---------------------------------------------------------------------
   7) MOBILNÍ NAVIGACE (dotnav) – oprava barevné kolize
   Panel měl pozadí linear-gradient(var(--dark) → var(--black)). Proměnná
   --dark byla v pozdější paletě předefinována na světlou (#f3f4f5), takže
   horní polovina panelu byla téměř bílá, zatímco text zůstal světlý
   (kontrast 1,09:1 = prakticky neviditelné menu). Panel vrácen do tmavé
   DNA webu a akcenty přebarveny na odstín čitelný na tmavém podkladu.
   ------------------------------------------------------------------ */
@media (max-width:680px){
  .dotnav__panel{
    background:linear-gradient(160deg,#101929 0%,#0b121e 100%) !important;
    border-left:3px solid #1B5688 !important;
    box-shadow:-22px 0 56px rgba(0,0,0,.55) !important;
  }
  .dotnav__title{ color:#73B4E6 !important; }                /* 7,9:1 místo 2,3:1 */
  .dotnav__list a{ color:#e9eaec !important; }
  .dotnav__list a::before{ background:#73B4E6 !important; }
  .dotnav__list a.is-current{ color:#73B4E6 !important; background:rgba(27,86,136,.16) !important; }
  .dotnav__close{ background:rgba(255,255,255,.06) !important; color:#e9eaec !important;
                  border:1px solid rgba(255,255,255,.14) !important; }
  .dotnav__close:hover,.dotnav__close:focus-visible{
    background:#1B5688 !important; color:#ffffff !important; border-color:#1B5688 !important; }
  .dotnav__close-btn{ color:#cfd2d6 !important; border:1.5px solid rgba(255,255,255,.22) !important; }
  /* CTA v menu = stejné jako primární CTA na PC (bílý text na modré) */
  .dotnav__cta{
    background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
    color:#ffffff !important;
    box-shadow:0 6px 18px rgba(27,86,136,.36),0 2px 6px rgba(0,0,0,.18),
               inset 0 1px 0 rgba(255,255,255,.14) !important;
  }
  .dotnav__cta:hover{
    background:linear-gradient(180deg,#1F6098 0%,#0F3A5C 100%) !important;
    box-shadow:0 14px 30px rgba(27,86,136,.5) !important;
  }
  .dotnav__scrim{ background:rgba(11,18,30,.55) !important; }  /* stejná modročerná jako hero */
}

/* ---------------------------------------------------------------------
   8) FIXNÍ SPODNÍ LIŠTA (jen mobil) – čitelnost a shoda s PC CTA
   Tmavý text na modré měl kontrast 2,6:1. Sjednoceno s primárním CTA.
   ------------------------------------------------------------------ */
.sticky-btn--phone{
  background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
  color:#ffffff !important;
  box-shadow:0 8px 24px rgba(0,0,0,.35),0 2px 6px rgba(27,86,136,.25) !important;
}
.sticky-btn--phone .ico{ color:#ffffff !important; }
.sticky-btn--inquiry{
  background:#ffffff !important;
  color:#134266 !important;
  border:2px solid #1B5688 !important;
  box-shadow:0 8px 24px rgba(11,18,30,.28) !important;
}

/* ---------------------------------------------------------------------
   9) INFORMAČNÍ LIŠTA POD HLAVIČKOU – stejná jako na PC
   Na mobilu byla tmavá poloprůhledná (přes hero), na PC světlá. Pod bílou
   hlavičkou tak vznikal tmavý pruh navíc. Sjednoceno na světlou variantu.
   ------------------------------------------------------------------ */
@media (max-width:680px){
  .sitenotice{
    margin-bottom:0 !important;
    background:#eef2f6 !important;
    border-bottom:1px solid #dfe4ea !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    color:#4a5560 !important;
    text-shadow:none !important;
  }
  .sitenotice strong{ color:#2a3542 !important; font-weight:700 !important; }
  .sitenotice a{ color:#1B5688 !important; }
  .sitenotice a:hover{ color:#134266 !important; }
  .sitenotice .sn-line{ color:#46505a !important; }
}

/* ---------------------------------------------------------------------
   10) PRUH S PŘEDNOSTMI (.strip) – stejný gradient i linka jako na PC
   ------------------------------------------------------------------ */
@media (max-width:768px){
  .strip{
    background:linear-gradient(180deg,#f7f9fb 0%,#eceff4 100%) !important;
    border-top:3px solid #1B5688 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 8px 20px -14px rgba(16,24,40,.2) !important;
  }
  .strip__inner span{ border-left-color:#e2e4e5 !important; color:#1e2a38 !important; }
  .strip__inner span::before{ color:#1B5688 !important; }
  .strip__inner span:hover{ color:#134266 !important; background:rgba(27,86,136,.06) !important; }
}

/* ---------------------------------------------------------------------
   11) PROKLIKOVACÍ PRUH (.leadband, jen ≤1024) – světlý pruh ve stejném
   odstínu jako .strip na PC, aby oba světlé pruhy ladily.
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .leadband{
    background:linear-gradient(180deg,#f7f9fb 0%,#eceff4 100%) !important;
    border-top:1px solid #e2e6ec !important;
    border-bottom:1px solid #dfe4ea !important;
    color:#16202e !important;
  }
  .leadband:hover,.leadband:active{
    background:linear-gradient(180deg,#f2f5f9 0%,#e6eaf0 100%) !important;
  }
  .leadband__eyebrow{ color:#1B5688 !important; }
  .leadband__title{ color:#16202E !important; }
  .leadband__cue{
    background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
    color:#ffffff !important;
    box-shadow:0 6px 16px -6px rgba(27,86,136,.6) !important;
  }
}

/* ---------------------------------------------------------------------
   12) DROBNÉ PRVKY – dorovnání na PC hodnoty
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  /* stín tlačítka „další" byl na menších šířkách plošší než na PC */
  .btn-more:hover{
    box-shadow:0 12px 22px rgba(16,24,40,.09),0 30px 60px rgba(27,86,136,.16) !important;
  }
  /* rámeček galerie – na PC bez rámu, na tabletu skoro černý */
  .svc__gallery{ border-color:rgba(255,255,255,.10) !important; }
}
@media (max-width:768px){
  /* telefon v hlavičce – stejný stín jako na PC */
  .header .btn--phone-sm{ box-shadow:0 6px 16px -6px rgba(27,86,136,.5) !important; }
}
@media (max-width:680px){
  /* štítek „Reklama" v patičce – vrácen hairline jako na PC */
  .adslot__tag{ border:1px solid rgba(255,255,255,.22) !important; color:#9fb0c2 !important; }
}

/* ---------------------------------------------------------------------
   13) SKIP-LINK (viditelný jen při ovládání klávesnicí, PC i mobil)
   Modrý text #1B5688 na grafitové #23262b měl kontrast 2,0:1. Přebarveno
   na světle modrý akcent z palety (7,9:1). Vzhled webu to nemění –
   prvek se zobrazí až po stisku Tabulátoru.
   ------------------------------------------------------------------ */
.skip-link{ background:#0b121e !important; color:#73B4E6 !important; }


/* =====================================================================
   ===  VÁRKA 20 – ZADANÉ ÚPRAVY (obsah, rozložení, reklama) ==========
   1) mobil: hero text výš + pobídka ke scrollování pod „horolezeckou
      technikou"; 2) fotopásy – přejmenování a tmavé provedení tlačítka;
      3) informační blok pod činnostmi vizuálně oddělen; 4) reklama
      v patičce přepracována do firemní grafiky; 5) pečeť s firemní
      značkou Anděl místo obecného štítu.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) MOBIL – blok textu v hero nahoru, blíž k šedé liště
   Hero mělo padding-top 72 px, který kompenzoval dřívější překryv šedé
   lišty přes fotku. Lišta už je v toku (várka 19), takže šlo o prázdné
   místo, které text zbytečně tlačilo dolů.
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .hero{ padding-top:0 !important; }
  .hero__inner{ padding-top:42px !important; }
}
@media (max-width:680px){
  .hero__inner{ padding-top:36px !important; }
  .hero .eyebrow{ margin-bottom:12px !important; }
}

/* ---------------------------------------------------------------------
   3) PEČEŤ „Lukáš Anděl" – firemní značka místo obecného štítu s fajfkou
   (platí pro desktopovou lištu i mobilní spouštěč profilu)
   ------------------------------------------------------------------ */
.hero__seal-mark{
  width:24px; height:24px; display:block; object-fit:contain;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.4));
}
.hero__plate-seal .hero__seal-mark{ width:26px; height:26px; }
.hero__profile-seal .hero__seal-mark{ width:23px; height:23px; }

/* ---------------------------------------------------------------------
   4) FOTOPÁS (01) PŘEDTÍM – přesunut nad blok „Nejste si jistí…"
   Uvnitř kontejneru, ale vizuálně od kraje ke kraji jako dřív.
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  .photoband--inline{
    width:100vw; max-width:100vw;
    margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
    margin-top:clamp(28px,6vw,42px); margin-bottom:clamp(28px,6vw,42px);
  }
}

/* Popisky fotopásů – zvýrazněný úvod „(01) PŘEDTÍM" / „(02) POTÉ" */
.photoband__cap strong{
  font-weight:700; color:#ffffff; letter-spacing:1.8px;
}

/* Tlačítko „POTÉ" – tmavé firemní provedení, tučný popis */
.photoband__next{
  background:linear-gradient(160deg,rgba(16,25,41,.92) 0%,rgba(9,15,26,.9) 100%) !important;
  border:1px solid rgba(115,180,230,.34) !important;
  border-radius:13px !important;
  box-shadow:0 16px 34px -14px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.08) !important;
  -webkit-backdrop-filter:blur(4px) !important; backdrop-filter:blur(4px) !important;
  padding:12px 12px 11px !important;
  transition:border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.photoband__next:hover,.photoband__next:focus-visible{
  border-color:#73B4E6 !important; transform:translateY(-52%) !important;
  box-shadow:0 20px 40px -14px rgba(0,0,0,.85) !important;
}
.photoband__next-lbl{
  font-weight:700 !important; font-size:12px !important; letter-spacing:2px !important;
  color:#ffffff !important; text-shadow:0 1px 6px rgba(0,0,0,.7) !important;
}
.photoband__next svg{ color:#73B4E6; }

/* ---------------------------------------------------------------------
   5) INFORMAČNÍ BLOK pod výčtem činností
   Měl shodný vzhled jako karty nad ním (stejný gradient, rám i stín),
   takže splýval. Odlišen jako samostatný poradenský panel: modrý nádech,
   světlejší rám, jiné zaoblení a oddělovací mezera.
   ------------------------------------------------------------------ */
#vykon .kb-sum__cta,
.kb-sum__cta{
  margin-top:clamp(26px,6vw,38px) !important;
  background:linear-gradient(160deg,rgba(27,86,136,.34) 0%,rgba(13,28,48,.55) 100%) !important;
  border:1px solid rgba(115,180,230,.34) !important;
  border-left:3px solid #73B4E6 !important;
  border-radius:20px !important;
  box-shadow:0 26px 52px -24px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.09) !important;
  position:relative;
}
#vykon .kb-sum__ctatext,
.kb-sum__ctatext{ color:#dbe7f3 !important; }
#vykon .kb-sum__cta strong,
.kb-sum__cta strong{ color:#ffffff !important; }

/* ---------------------------------------------------------------------
   6) REKLAMA V PATIČCE – přepracováno do firemní grafiky
   Dříve: plný pruh přes celou šířku, šedý štítek a facebookově modré
   tlačítko #1877F2, které v paletě webu působilo cizorodě.
   Nyní: samostatná karta ve stejné DNA jako ostatní karty webu (tmavé
   sklo, modrý akcent vlevo, 16px rádius), štítek jako modrý chip a CTA
   ve firemním gradientu shodném s ostatními tlačítky.
   ------------------------------------------------------------------ */
.adslot{
  border-top:1px solid rgba(255,255,255,.08) !important;
  background:transparent !important;
  margin-top:40px !important;
  padding:26px 0 6px !important;
}
.adslot__inner{
  gap:14px 20px !important;
  padding:18px 20px !important;
  background:linear-gradient(160deg,rgba(23,34,52,.74) 0%,rgba(13,20,32,.62) 100%) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  border-left:3px solid #1B5688 !important;
  border-radius:16px !important;
  box-shadow:0 22px 46px -22px rgba(0,0,0,.8) !important;
  justify-content:space-between !important;
}
.adslot__tag{
  font-family:'Oswald',sans-serif !important; font-size:10px !important; font-weight:600 !important;
  letter-spacing:2.2px !important; text-transform:uppercase !important;
  color:#9fd0f5 !important;
  background:rgba(27,86,136,.22) !important;
  border:1px solid rgba(159,208,244,.30) !important;
  border-radius:999px !important;
  padding:4px 11px !important;
}
.adslot__title{
  font-family:'Oswald',sans-serif !important; font-weight:600 !important;
  font-size:15.5px !important; letter-spacing:.5px !important; line-height:1.3 !important;
  color:#ffffff !important;
}
.adslot__desc{ color:#b7c4d3 !important; font-size:12.5px !important; line-height:1.5 !important; }
.adslot__cta{
  font-family:'Oswald',sans-serif !important; font-weight:600 !important;
  font-size:13.5px !important; letter-spacing:1.4px !important; text-transform:uppercase !important;
  color:#ffffff !important;
  background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:9px !important;
  padding:12px 20px !important;
  box-shadow:0 6px 18px rgba(27,86,136,.36),0 2px 6px rgba(0,0,0,.18),
             inset 0 1px 0 rgba(255,255,255,.14) !important;
  transition:background .22s ease, transform .22s ease, box-shadow .22s ease;
}
.adslot__cta:hover,.adslot__cta:focus-visible{
  background:linear-gradient(180deg,#1F6098 0%,#0F3A5C 100%) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 14px 30px rgba(27,86,136,.5),0 4px 10px rgba(0,0,0,.24),
             inset 0 1px 0 rgba(255,255,255,.16) !important;
}
.adslot__fb{ opacity:.9; }
/* mobil – svislý štítek zůstává, jen v nové paletě */
@media (max-width:680px){
  .adslot{ padding:22px 0 4px !important; }
  .adslot__inner{ padding:16px 16px !important; column-gap:14px !important; }
  .adslot__tag{
    background:transparent !important;
    border:0 !important; border-radius:0 !important;
    border-right:1px solid rgba(159,208,244,.28) !important;
    padding:0 13px 0 0 !important;
    letter-spacing:3px !important; color:#9fd0f5 !important;
  }
}


/* =====================================================================
   ===  VÁRKA 21 – TYPOGRAFIE ODSTAVCŮ A PROFIL NA MOBILU =============
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) Zarovnání do bloku s dělením slov
   Bez dělení slov vznikají v úzkém sloupci „řeky" – přehnaně velké
   mezery mezi slovy. hyphens:auto využívá české dělicí vzory (stránka
   má lang="cs"); limity brání dělení krátkých slov a osamocených slabik.
   ------------------------------------------------------------------ */
@media (max-width:768px){
  .ai-excerpt,
  .ai-excerpt--full,
  .note__body{
    text-align:justify !important;
    text-justify:inter-word;
    -webkit-hyphens:auto; hyphens:auto;
    -webkit-hyphenate-limit-before:3; -webkit-hyphenate-limit-after:3;
    hyphenate-limit-chars:6 3 3;
    overflow-wrap:break-word;
    text-wrap:pretty;
  }
}

/* Profilové okno – souvislý text vždy do bloku a s dělením slov */
.bio__body p{
  text-align:justify;
  text-justify:inter-word;
  -webkit-hyphens:auto; hyphens:auto;
  -webkit-hyphenate-limit-before:3; -webkit-hyphenate-limit-after:3;
  hyphenate-limit-chars:6 3 3;
  overflow-wrap:break-word;
  text-wrap:pretty;
}

/* ---------------------------------------------------------------------
   2) MOBIL – v profilu odstraněn řádek „Ověřený provozovatel · IČO · DIČ"
   včetně pečeti se štítem. Údaje zůstávají v patičce, v kontaktech
   i ve strukturovaných datech, takže se nikde neztrácejí.
   ------------------------------------------------------------------ */
@media (max-width:768px){
  .bio__eyebrow{ display:none !important; }
  .bio__head-txt .bio__title{ margin-top:0 !important; }
}


/* =====================================================================
   ===  VÁRKA 22 – KOREKCE (šipka, odsazení hero, ikona) ==============
   ===================================================================== */

/* ---------------------------------------------------------------------
   2) PEČEŤ „Lukáš Anděl" – portrétová ikona
   Místo obecného štítu i místo firemní značky je v pečeti portrét
   Lukáše Anděla. Rám drží firemní modrou, aby dlaždice zapadla
   do zbytku lišty.
   ------------------------------------------------------------------ */
.hero__plate-seal,
.hero__profile-seal{
  background:#0b121e !important;
  padding:0 !important; overflow:hidden !important;
  border:1px solid rgba(115,180,230,.42) !important;
  box-shadow:0 10px 22px rgba(11,18,30,.55), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.hero__seal-mark{
  width:100% !important; height:100% !important;
  object-fit:cover !important; object-position:center 34% !important;
  display:block !important; border-radius:inherit !important;
  filter:none !important;
}
/* pečeť o něco větší – portrét potřebuje víc plochy než piktogram */
.hero__plate-seal{ width:46px !important; height:46px !important; border-radius:12px !important; }
.hero__profile-seal{ width:44px !important; height:44px !important; border-radius:11px !important; }
@media (prefers-reduced-motion:reduce){ .hero__plate-seal{ animation:none !important; } }


/* =====================================================================
   ===  VÁRKA 23 – ŠIPKA A COOKIES LIŠTA (mobil) ======================
   ===================================================================== */

/* ---------------------------------------------------------------------
   2) COOKIES LIŠTA – nikdy nesmí zakrýt CTA
   Dosud měla na mobilu napevno bottom:84px, tedy trvale nadzvednutou
   pozici počítanou se spodní CTA lištou – i ve chvíli, kdy spodní lišta
   ještě vůbec není zobrazená (po načtení stránky je skrytá, dokud je
   vidět hero). Výsledkem bylo, že plachta visela ve výšce hlavního
   tlačítka „Zavolat nyní".

   Nově řídí polohu proměnná --cc-bottom, kterou nastavuje skript podle
   skutečného stavu:
     • po načtení / dokud je spodní lišta skrytá → lišta dole (14 px)
     • jakmile naskočí „Nezávazná poptávka" (nebo „Zavolat") → nad ni
     • pojistka: kdyby přesto hrozil překryv hlavního CTA, klesne dolů
   ------------------------------------------------------------------ */
@media (max-width:680px){
  .cc{
    bottom:calc(var(--cc-bottom, 14px) + env(safe-area-inset-bottom,0px)) !important;
    transition:bottom .28s cubic-bezier(.22,.61,.36,1);
  }
}
@media (prefers-reduced-motion:reduce){
  .cc{ transition:none !important; }
}

/* Úsporný režim cookies lišty – nasadí se jen na velmi nízkých displejích,
   kde by se plná lišta nevešla pod hlavní CTA. Zachovává čitelnost
   i dotykovou plochu tlačítek, jen zkracuje odsazení a řádkování. */
@media (max-width:680px){
  .cc.cc--tight{ padding:9px 11px; gap:7px; border-radius:11px; }
  .cc.cc--tight .cc__text{ font-size:11.5px; line-height:1.34; }
  .cc.cc--tight .cc__actions{ gap:7px; }
  .cc.cc--tight .cc__btn{ min-height:38px; padding:7px 11px; font-size:10.5px; }
}

/* ---------------------------------------------------------------------
   BÍLÁ ŠIPKA – přesun stávajícího prvku .hero__inner::after nahoru
   Toto je ta šipka z fotky (22 px, bílá obruba 2,6 px, u pravého okraje).
   Dosud byla ukotvená absolutně k patě hero přes bottom:100px, takže na
   mobilu dosedla na tlačítko „Zavolat nyní".

   Nemění se ani provedení, ani vodorovná poloha – pouze způsob ukotvení:
   místo absolutního odsazení od paty je šipka vložena do toku mezi nadpis
   a CTA (flex + order). Tím se drží pod „horolezeckou technikou" na
   jakékoli výšce displeje a s tlačítkem se už nemůže potkat.

   Vodorovně sedí přesně jako dřív: dřívější right:clamp(30px,16vw,84px)
   se počítalo od okraje .hero__inner, v toku se totéž odsazení dorovná
   o jeho vnitřní odsazení clamp(20px,5vw,34px).
   ------------------------------------------------------------------ */
@media (max-width:1024px){
  /* pořadí prvků v hero – šipka mezi nadpis a tlačítka */
  .hero .eyebrow{ order:1 }
  .hero h1{ order:2; margin-bottom:8px !important; }
  .hero__sub{ order:4 }
  .hero__cta{ order:5 }
  .hero__profile{ order:6 }

  .hero__inner::after{
    order:3;
    position:static !important;
    left:auto !important; right:auto !important; top:auto !important; bottom:auto !important;
    display:block !important; flex:none !important;
    align-self:flex-end !important;
    width:22px !important; height:22px !important;
    margin:14px calc(clamp(30px,16vw,84px) - clamp(20px,5vw,34px)) 0 0 !important;
    border-right:2.6px solid #fff !important; border-bottom:2.6px solid #fff !important;
    border-top:0 !important; border-left:0 !important;
    transform:rotate(45deg) !important;
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.75)) !important;
    animation:heroScrollCueR 1.9s ease-in-out infinite !important;
    opacity:.95 !important;
  }

  /* pojistka – žádná další šipka se v hero nesmí objevit */
  .hero::after{ display:none !important; }
  .hero__mark::after{ content:none !important; }
}
@media (prefers-reduced-motion:reduce){
  .hero__inner::after{ animation:none !important; opacity:.9 !important; }
}

/* Cookies lišta ve výchozí poloze překrývá dlaždici „Lukáš Anděl" –
   silnější stín, aby působila jako panel nad obsahem, ne jako pruh
   přilepený ke spodnímu okraji. */
@media (max-width:680px){
  .cc.cc--over-profile{
    box-shadow:0 26px 60px -18px rgba(0,0,0,.78), inset 0 1px 0 rgba(255,255,255,.07);
  }
}

/* Cookies lišta na velmi úzkých displejích (≤340 px)
   Zákonné znění je delší než přátelská varianta a při 12 px by se na
   320px displeji zlomilo do tří řádků. Zúžením okrajů a odsazení
   a drobným zmenšením písma se udrží dva řádky i tam.
   Na běžných telefonech (≥360 px) zůstává vše beze změny. */
@media (max-width:340px){
  .cc{ left:8px; right:8px; padding:11px 11px; }
  .cc__text{ font-size:11px; line-height:1.36; }
}

/* Popisek fotky (01) – na mobilu bez závěru „na laně",
   aby se vešel na jeden řádek. Na tabletu a výš zůstává celý. */
@media (max-width:680px){
  .photoband__cap .cap-long{ display:none; }
}



}



/* Popisek „Prozkoumat“ se vykresluje ze stylu, aby netvořil součást
   textu nadpisu H1 (vyhledávače čtou obsah H1 včetně vnořených prvků).
   Přístupnost drží aria-label na samotném odkazu. */
.hero__scrolldown__label::before{ content:"Prozkoumat"; }

/* =====================================================================
   ===  FAQ – sjednocení a čitelnost ovladače (várka 27) ==============
   1) Poslední položka „Další časté dotazy" i otázky v ní vypadají
      naprosto stejně jako ostatní – žádné vlastní velikosti, barvy
      ani odsazení. Obal jen drží obsah, sám nic nekreslí.
   2) Ovladač +/− měl v otevřeném stavu černý znak na tmavě modrém
      kolečku (kontrast 1,5:1). Otevřený stav má nově bílý znak
      na firemní modré, zavřený tmavý znak na světlé kartě.
   ===================================================================== */

/* --- 1) obal vnořených otázek nic nekreslí --- */
.faq__more{
  padding:0 !important; margin:0 !important; border:0 !important; background:none !important;
}
/* poslední položka je vizuálně shodná s ostatními */
.faq details.faq__item--more > summary{ color:#16202E !important; }
.faq details.faq__item--more[open]{ background:transparent !important; }
/* vnořené položky dědí přesně vzhled hlavních – jen se srovná spodní linka */
.faq__more > details{ border-bottom:1px solid #e6e6e6 !important; }
.faq__more > details:last-child{ border-bottom:0 !important; }

/* --- 2) ovladač +/− --- */
.faq summary::after{
  color:#16202E !important;
  border-color:rgba(16,24,40,.28) !important;
  background:transparent !important;
}
.faq details[open] > summary::after{
  background:#1B5688 !important;
  border-color:#1B5688 !important;
  color:#ffffff !important;
}
.faq summary:hover::after{ border-color:#1B5688 !important; }

/* =====================================================================
   ===  GALERIE – popisek fotky na jeden řádek (várka 28) =============
   Velikost písma je odvozená z měření skutečného řezu Oswald 600.
   Nejdelší popisek („Čištění střechy domu · Havlíčkova, Tábor“) měří
   při 15 px celkem 362 px; dostupná šířka je displej mínus 36 px
   (odsazení kontejneru) a 24 px (odsazení popisku). Vzorec drží text
   pod touto hranicí a od 460 px nahoru se vrací na plných 15 px.
   Dekorativní linka před textem je na telefonu skrytá, aby text získal
   dalších 38 px.
   ===================================================================== */
@media (max-width:680px){
  .svc__stage .svc__caption{
    font-size:clamp(10.5px, calc(3.05vw + 0.2px), 15px) !important; letter-spacing:.2px !important;
    letter-spacing:.2px !important;
    line-height:1.25 !important;
    padding-left:12px !important; padding-right:12px !important;
    white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
  }
  .svc__stage .svc__caption::before{ display:none !important; }
}

/* =====================================================================
   ===  MOBIL – sjednocení informačních lišt (várka 31) ==============
   Horní lišta „Navštivte oficiální stránky…" a dolní proklik
   „Nejčastěji vás zajímá" měly každá jiný podklad – jedna plochá šedá,
   druhá s gradientem, a lišily se i akcenty. Nově obě sdílejí týž
   světlý gradient s modrým akcentním proužkem nahoře (stejný jako
   pruh s přednostmi), aby web působil uceleně.
   Referenční styl: světlý gradient #F7F9FB → #ECEFF4, akcent #1B5688.
   ===================================================================== */
@media (max-width:680px){
  /* --- horní lišta pod hlavičkou --- */
  .sitenotice{
    background:linear-gradient(180deg,#f7f9fb 0%,#eceff4 100%) !important;
    border-top:1px solid #dfe4ea !important;
    border-bottom:1px solid #dfe4ea !important;
    box-shadow:inset 0 2px 0 rgba(27,86,136,.14) !important;
    -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
    color:#46505a !important; text-shadow:none !important;
  }
  .sitenotice strong{ color:#16202E !important; font-weight:700 !important; }
  .sitenotice a{ color:#1B5688 !important; }
  .sitenotice a:hover{ color:#134266 !important; }

  /* --- dolní proklikový pruh --- */
  .leadband{
    background:linear-gradient(180deg,#f7f9fb 0%,#eceff4 100%) !important;
    border-top:1px solid #dfe4ea !important;
    border-bottom:1px solid #dfe4ea !important;
    box-shadow:inset 0 2px 0 rgba(27,86,136,.14) !important;
    color:#16202E !important;
  }
  .leadband:hover,.leadband:active{
    background:linear-gradient(180deg,#f2f5f9 0%,#e6eaf0 100%) !important;
  }
  .leadband__eyebrow{ color:#1B5688 !important; }
  .leadband__title{ color:#16202E !important; }
}


/* =====================================================================
   ===  HERO – tlačítko „Lukáš Anděl": prohození, bez rámečku (v157) ==
   Ověřeno reálným renderem (Chrome, mobil, po dotyku, cookies vyřízeno).
   NEDOTÝKÁ SE polohy „Zavolat nyní" – ta má výchozí margin-top:auto,
   jak byla vyladěná. Řeší JEN profil:
     • bez rámečku a bez scrimu ::before (ten dělal viditelný obdélník,
       který z dálky vypadal jako rámeček) – čitelnost drží stín textu
     • po vyřízení cookies profil nad CTA, margin-top:auto přechází na
       profil (první z dvojice), takže díra je nad celou dvojicí, ne mezi
     • mezi tlačítky 12 px
   ===================================================================== */
@media (max-width:1024px){
  /* --- profil BEZ rámečku, BEZ scrimu --- */
  .hero__profile{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
    padding:10px 12px !important;
  }
  .hero__profile::before{ content:none !important; display:none !important; }
  .hero__profile::after{ content:none !important; display:none !important; }
  .hero__profile:hover, .hero__profile:focus, .hero__profile:focus-visible, .hero__profile:active{
    background:transparent !important; border:0 !important;
    box-shadow:none !important; outline:none !important; transform:none !important;
  }

  /* čitelnost přes stín textu místo podkladu */
  .hero__profile-txt strong{
    color:#fff !important;
    text-shadow:0 2px 12px rgba(0,0,0,.92),0 1px 3px rgba(0,0,0,.95) !important;
  }
  .hero__profile-txt span{
    color:#d3e3f2 !important;
    text-shadow:0 1px 8px rgba(0,0,0,.95),0 1px 2px rgba(0,0,0,.95) !important;
  }
  /* portrét – jemný prstenec, ať drží jako živý prvek */
  .hero__profile-seal{
    background:#0b121e !important;
    border:1px solid rgba(159,208,244,.5) !important;
    box-shadow:0 4px 14px rgba(0,0,0,.6) !important;
  }
  .hero__profile-chev{ color:#9FD0F5 !important; filter:drop-shadow(0 1px 5px rgba(0,0,0,.85)) !important; }

  /* --- prohození pořadí po vyřízení cookies --- */
  /* Dvojici drží dole margin-top:auto na profilu (prvním z dvojice).
     „Zavolat nyní" je poslední prvek a dosedá na spodní padding hero,
     takže jeho poloha je daná zdola a nemění se. Mezeru profil↔CTA
     řídí výhradně margin-bottom profilu – zmenšení = profil sjede k CTA,
     tlačítko zůstává. */
  /* --- prohození pořadí po vyřízení cookies --- */
  /* Dvojice drží DOLE (jako vyladěná poloha „Zavolat nyní"): margin-top:auto
     je na profilu = prvním z dvojice, takže volný prostor jde NAD dvojici,
     ne mezi tlačítka. Profil sedí těsně nad CTA (2 px), celek působí sevřeně
     a „Zavolat nyní" zůstává na své vyladěné dolní pozici. */
  html.cc-resolved .hero__profile{
    order:5 !important;
    margin-top:auto !important;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }
  html.cc-resolved .hero__cta{
    order:6 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
  html.cc-resolved .hero__cta{
    order:6 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}

/* Horní lišta – na mobilu certifikace IRATA/FISAT, na desktopu odkaz
   na oficiální web. Obě nesou důvěryhodnostní sdělení. */
.sn-line--mobile{ display:none; }
@media (max-width:680px){
  .sn-line--desktop{ display:none !important; }
  .sn-line--mobile{ display:block !important; }
}

/* =====================================================================
   ===  KARTY ZAKLADATELŮ – prémiová čitelnost textů (v169) ==========
   Nadřádek (role) se ztrácel na světlé obloze – světle modrá bez stínu.
   Přidán stín všem textům + silnější spodní gradient. Na mobilu kratší
   popis (fd-mob) do dvou řádků. Platí ve všech zobrazeních. */
.founders__cap{
  background:linear-gradient(to top,
    rgba(6,10,16,.97) 0%, rgba(6,10,16,.9) 30%,
    rgba(6,10,16,.62) 58%, rgba(6,10,16,.22) 82%, transparent 100%) !important;
  padding-top:44px !important;
}
.founders__role{
  color:#a8d0f0 !important;
  text-shadow:0 1px 8px rgba(0,0,0,.95), 0 2px 4px rgba(0,0,0,.9) !important;
}
.founders__name{
  text-shadow:0 2px 16px rgba(0,0,0,.85), 0 1px 4px rgba(0,0,0,.9) !important;
}
.founders__desc{
  color:#dbe6f2 !important;
  text-shadow:0 1px 6px rgba(0,0,0,.9), 0 1px 2px rgba(0,0,0,.85) !important;
}
/* přepínání popisu desktop / mobil */
.fd-mob{ display:none; }
@media (max-width:680px){
  .fd-full{ display:none; }
  .fd-mob{ display:inline; }
  .founders__desc{ font-size:13.5px !important; line-height:1.45 !important; }
  .founders__role{ font-size:11px !important; letter-spacing:1.5px !important; }
}

/* =====================================================================
   ===  Galerie – popisek: rozšířená plocha na mobilu (v171) =========
   Zmenšené boční odsazení + letter-spacing = víc místa pro plný text
   na jeden řádek. Platí do 680px. */
@media (max-width:680px){
  .svc__stage .svc__caption,
  .svc__caption{
    padding-left:12px !important;
    padding-right:12px !important;
    letter-spacing:.2px !important;
  }
}

/* =====================================================================
   ===  FAQ – oprava centrování +/− v kolečku (v172) =================
   line-height:0 posouvalo znak mimo střed kolečka. Sjednoceno na
   flexbox centrování s optickou korekcí pro − (mínus sedí výš). */
.faq summary::after{
  display:flex !important; align-items:center !important; justify-content:center !important;
  line-height:1 !important; font-size:24px !important; font-weight:400 !important;
  box-sizing:border-box !important; padding:0 !important;
  font-family:'Arial',sans-serif !important;   /* stabilní glyf +/− */
}
/* + má těžiště níž, − výš – jemná optická korekce přes padding */
.faq summary::after{ padding-bottom:3px !important; }        /* + optika */
.faq details[open] summary::after{ padding-bottom:0 !important; }  /* − optika */

/* =====================================================================
   ===  Modál profilu – oprava neviditelného „ghost" tlačítka (v175) =
   .btn--ghost mělo z jiného pravidla tmavý text (#23262b), na tmavém
   podkladu modálu splývalo. V modálu vždy světlá, čitelná varianta. */
.bio__foot .btn--ghost{
  color:#fff !important;
  background:rgba(255,255,255,.08) !important;
  border:1.5px solid rgba(159,208,244,.6) !important;
  -webkit-backdrop-filter:blur(2px) !important; backdrop-filter:blur(2px) !important;
}
.bio__foot .btn--ghost:hover,
.bio__foot .btn--ghost:focus-visible{
  background:#fff !important;
  color:#134266 !important;
  border-color:#fff !important;
  box-shadow:0 8px 22px rgba(0,0,0,.35) !important;
}

/* =====================================================================
   ===  HAMBURGER MENU – prémiový vzhled (v181) ======================
   Panel dostal hloubku a eleganci: světelný akcent nahoře, číslované
   položky s jemnými oddělovači, rafinovanější hover, lepší hlavička.
   Vše v modré DNA webu. Platí na mobilu/tabletu (≤680px). */
@media (max-width:680px){
  /* Panel – hlubší pozadí s jemným světelným nádechem shora vpravo */
  /* ---- Světlý, čistý panel – důvěryhodný, sladěný s webem (v202) ---- */
  .dotnav__panel{
    background-color:rgba(248,251,253,.74) !important;   /* výraznější průhlednost */
    background-image:
      radial-gradient(130% 60% at 100% 0%, rgba(34,102,156,.12) 0%, rgba(34,102,156,0) 55%),
      linear-gradient(180deg, rgba(255,255,255,.30) 0%, rgba(245,248,251,.22) 100%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(1.35) !important;
    backdrop-filter:blur(18px) saturate(1.35) !important;   /* frosted glass – pozadí prosvítá, text čitelný */
    border-left:1px solid rgba(255,255,255,.35) !important;
    box-shadow:-26px 0 60px rgba(11,18,30,.28) !important;
    padding-top:22px !important;
  }
  /* fallback pro prohlížeče bez podpory backdrop-filter – kryjící pozadí,
     ať je text vždy čitelný i bez rozostření */
  @supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
    .dotnav__panel{ background-color:rgba(248,251,253,.97) !important; }
  }
  /* modrá světelná linka podél levé hrany – jemný akcent z hero */
  .dotnav__panel::before{
    content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
    background:linear-gradient(180deg, #22669C 0%, #1B5688 60%, rgba(27,86,136,.2) 100%);
    pointer-events:none;
  }

  /* Hlavička – jemná spodní linka */
  .dotnav__head{
    padding-bottom:15px !important; margin-bottom:16px !important;
    border-bottom:1px solid rgba(27,86,136,.12) !important;
    position:relative;
  }
  .dotnav__title{
    color:#22669C !important; font-size:11px !important; letter-spacing:3.2px !important;
    opacity:1 !important;
  }

  /* Seznam – čitelné položky s jemnými oddělovači */
  .dotnav__list{ gap:0 !important; counter-reset:navitem; margin-bottom:20px !important; }
  .dotnav__list li{ border-bottom:1px solid rgba(11,18,30,.06); }
  .dotnav__list li:last-child{ border-bottom:0; }
  .dotnav__list a{
    counter-increment:navitem;
    display:flex !important; align-items:baseline; gap:14px;
    padding:15px 10px 15px 10px !important; border-radius:8px !important;
    font-size:18px !important; font-weight:600 !important; letter-spacing:.3px !important;
    color:#16202E !important;
    transition:color .22s var(--ease), padding-left .22s var(--ease), background .22s var(--ease) !important;
  }
  /* pořadové číslo (01, 02, …) – decentní modré */
  .dotnav__list a::after{
    content:counter(navitem, decimal-leading-zero);
    margin-left:auto; align-self:center;
    font-family:'Oswald',sans-serif; font-size:11px; font-weight:600; letter-spacing:1px;
    color:rgba(34,102,156,.5);
    transition:color .22s var(--ease);
  }
  /* levý akcentní proužek – firemní modrá */
  .dotnav__list a::before{
    left:2px !important; width:3px !important; height:60% !important;
    background:linear-gradient(180deg,#22669C,#1B5688) !important;
    border-radius:2px !important;
  }
  .dotnav__list a:hover,.dotnav__list a:active{
    background:linear-gradient(90deg, rgba(34,102,156,.09) 0%, rgba(34,102,156,0) 100%) !important;
    padding-left:20px !important; color:#15426A !important;
  }
  .dotnav__list a:hover::after,.dotnav__list a:active::after{ color:#22669C !important; }
  .dotnav__list a.is-current{
    color:#15426A !important;
    background:linear-gradient(90deg, rgba(34,102,156,.14) 0%, rgba(34,102,156,0) 100%) !important;
    padding-left:20px !important;
  }
  .dotnav__list a.is-current::after{ color:#22669C !important; }

  /* CTA – primární modrá, stejná jako hero tlačítka */
  .dotnav__cta{
    background:linear-gradient(180deg,#22669C 0%,#15426A 100%) !important;
    color:#ffffff !important;
    letter-spacing:1.6px !important; font-size:14px !important;
    border:1px solid rgba(34,102,156,.3) !important;
    padding:16px 18px !important;
    box-shadow:0 8px 20px rgba(27,86,136,.28), inset 0 1px 0 rgba(255,255,255,.16) !important;
  }
  .dotnav__cta:hover{
    background:linear-gradient(180deg,#1F6098 0%,#0F3A5C 100%) !important;
    box-shadow:0 12px 26px rgba(27,86,136,.4) !important;
  }

  /* Nadpis / titulek v hlavičce zůstává modrý; zavírací kolečko světlé */
  .dotnav__close{
    background:rgba(34,102,156,.08) !important;
    border:1px solid rgba(34,102,156,.2) !important;
    color:#22669C !important;
  }
  .dotnav__close:hover,.dotnav__close:focus-visible{
    background:#22669C !important; color:#fff !important; border-color:#22669C !important;
  }

/* =====================================================================
   ===  Ceník – zmínka o AI kalkulátoru ceny (v185) ==================
   Zvýrazněný odstavec s odkazem na AI kalkulátor, laděný do modré. */
.cenik__ai{
  margin:14px 0 !important;
  padding:14px 16px;
  background:linear-gradient(135deg, rgba(34,102,156,.07) 0%, rgba(34,102,156,.02) 100%);
  border:1px solid rgba(34,102,156,.18);
  border-left:3px solid #22669C;
  border-radius:10px;
  font-size:15px; line-height:1.55;
}
.cenik__ai-link{
  color:#15426A; font-weight:600; text-decoration:none;
  border-bottom:1.5px solid rgba(34,102,156,.35);
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.cenik__ai-link:hover,.cenik__ai-link:focus-visible{
  color:#22669C; border-color:#22669C;
}
.cenik__ai-arrow{ font-weight:700; white-space:nowrap; }

/* =====================================================================
   ===  FOTO 01 „PŘEDTÍM" – štítek ve stylu tlačítka POTÉ (v186) =====
   Popisek (01) Předtím dostane stejný prémiový vzhled jako protější
   tlačítko POTÉ (tmavý glass box, modrý rámeček), aby bylo patrné, že
   dvojice předtím/poté patří k sobě. Vlevo dole, zrcadlově k POTÉ. */
.photoband--inline{ position:relative; }
.photoband--inline .photoband__cap{
  left:14px !important; right:auto !important; bottom:14px !important;
  width:auto !important; max-width:calc(100% - 90px);
  padding:11px 15px !important;
  background:linear-gradient(160deg,rgba(16,25,41,.92) 0%,rgba(9,15,26,.9) 100%) !important;
  border:1px solid rgba(115,180,230,.34) !important;
  border-radius:13px !important;
  box-shadow:0 16px 34px -14px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.08) !important;
  -webkit-backdrop-filter:blur(4px) !important; backdrop-filter:blur(4px) !important;
  font-family:'Oswald',sans-serif !important; font-weight:600 !important;
  font-size:11.5px !important; letter-spacing:1.4px !important; text-transform:uppercase !important;
  color:#ffffff !important; text-shadow:0 1px 6px rgba(0,0,0,.7) !important;
  line-height:1.35 !important;
}
/* modrý indikátor „předtím" (šipka nahoru) – ladí se šipkou dolů u POTÉ */
.photoband--inline .photoband__cap::before{
  content:"01" !important;
  display:inline-block; margin-right:9px !important; vertical-align:0 !important;
  font-weight:700 !important; font-size:12px !important; letter-spacing:2px !important;
  color:#73B4E6 !important;
}
/* číslo (01) je teď v ::before, tak ho schováme z textu – necháme jen „PŘEDTÍM – …" */
.photoband--inline .photoband__cap strong{ font-weight:600 !important; }



/* =====================================================================
   ===  Fotopás – popisek (02) POTÉ stejný glass styl jako 01 (v186) =
   Foto 02 dostalo photoband--inline (stejný štítek jako 01 a tlačítko
   POTÉ). Číslo (02) má ale přímo v textu, tak potlačíme ::before "01". */
.photoband--inline .photoband__cap--pote::before{
  content:"" !important;               /* nemá vlastní "01" – číslo je v textu */
  width:3px !important; height:15px !important; border-radius:2px !important;
  background:#73B4E6 !important; margin-right:0 !important;
  display:none !important;             /* pruh nepotřebujeme, (02) je v textu */
}
.photoband--inline .photoband__cap--pote strong{ color:#9FD0F5 !important; }

/* =====================================================================
   ===  Neviditelná klikací vrstva přes scroll šipku (v190) ==========
   Skutečný odkaz na #sluzby umístěný přesně přes šipku hero__inner::after.
   Neviditelný (žádné pozadí/rámeček), jen klikací. Pouze mobil/tablet. */
.hero__cue-hit{
  position:absolute;
  z-index:7;
  display:block;
  background:none;
  border:0;
  outline:0 !important;               /* žádný rámeček nikdy */
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
  box-shadow:none !important;
  cursor:pointer;
  /* rozměr a poloha (right/bottom) nastavuje JS podle šířky displeje */
}
/* neviditelná i po kliknutí, fokusu a při aktivaci – žádný focus ring */
.hero__cue-hit:focus,
.hero__cue-hit:focus-visible,
.hero__cue-hit:active,
.hero__cue-hit:hover{
  outline:0 !important;
  border:0 !important;
  box-shadow:none !important;
  background:none !important;
}
@media (min-width:1025px){
  .hero__cue-hit{ display:none !important; }   /* na PC šipka neexistuje */
}

/* =====================================================================
   ===  Karty zakladatelů – zkrácená role na mobilu (v191) ===========
   Na mobilu zůstává jen „Zakladatel" / „Spoluzakladatel", zbytek
   za tečkou se skryje. Na tabletu a výš je celý text. */
@media (max-width:680px){
  .founders__role .role-rest{ display:none; }
}

/* =====================================================================
   ===  Řádkování textů (v192) =======================================
   1) Věta „Nebo hledáte práci…" na samostatném řádku (přes <br>).
   2) Patička: na mobilu „oficiální web společnosti: …" na samostatném
      a jediném řádku. */
@media (max-width:680px){
  .footer__official{ font-size:11.5px; }           /* aby se odkaz vešel na 1 řádek i na 360px */
  .footer__official-web{ display:block; white-space:nowrap; }  /* odkaz na vlastní jediný řádek */
  .footer__official-web a{ white-space:nowrap; }   /* URL se nezalomí */
}

/* =====================================================================
   ===  Bio odstavec – svislé vymezení vpravo na mobilu (v194) =======
   Odstavec o praxi a referencích je na mobilu jemně vymezený svislým
   tmavě modrým prvkem VPRAVO. Laděno s modrou paletou webu. */
@media (max-width:680px){
  .bio-highlight{
    border-left:3.5px solid #22669C;
    border-image:linear-gradient(180deg, #22669C 0%, #134266 100%) 1;
    padding-left:16px;
    margin-left:2px;
  }
}

/* =====================================================================
   ===  Menu tlačítka – žádný focus rámeček po kliknutí (v198) ========
   Hamburger (otvírá menu) i křížek (zavírá) nesmí mít modrý outline
   po kliknutí. Fokus zůstává funkční pro klávesnici (jemný, ne rámeček). */
.nav-toggle,
.dotnav__close,
.dotnav__close-btn{
  outline:0 !important;
  -webkit-tap-highlight-color:transparent;
}
.nav-toggle:focus,
.nav-toggle:focus-visible,
.nav-toggle:active,
.dotnav__close:focus,
.dotnav__close:focus-visible,
.dotnav__close:active,
.dotnav__close-btn:focus,
.dotnav__close-btn:focus-visible,
.dotnav__close-btn:active{
  outline:0 !important;
  box-shadow:none !important;
}

/* =====================================================================
   ===  Mobil používá jen prémiové dotnav menu (v198) ================
   Staré světlé .nav menu se na mobilu otevíralo SOUČASNĚ s dotnav a
   překrývalo ho svým bílým pozadím. Na mobilu ho úplně skryjeme –
   navigaci obstarává výhradně tmavé prémiové dotnav. */
@media (max-width:1024px){
  .nav,
  .nav.open,
  .nav.is-open{ display:none !important; }
}

/* =====================================================================
   ===  OPRAVA: hamburger otevírá prémiové dotnav menu (v199) ========
   Dřívější pravidla skrývala .dotnav i staré .nav současně, takže
   hamburger nic neotevřel. Zde dotnav znovu zapneme (panel + scrim),
   ale jeho vlastní tečkový trigger necháme skrytý – menu otevírá
   viditelný hamburger v hlavičce (.nav-toggle). */
@media (max-width:1024px){
  .dotnav{ display:block !important; }
  /* vlastní trigger dotnav (tři tečky) nepotřebujeme – otevírá hamburger */
  .dotnav__trigger{ display:none !important; }
  /* panel a scrim musí být funkční */
  .dotnav__scrim{ display:block !important; }
  .dotnav__panel{ display:flex !important; }
}

/* =====================================================================
   ===  Prémiový loading spinner pro obrázky (v204) ==================
   Při pomalém načítání se místo ošklivého alt textu zobrazí tmavý
   podklad s otáčejícím se prémiovým kolečkem v barvě webu. Po načtení
   fotky (třída .img-ready na kontejneru) spinner zmizí. */

/* kontejnery, které mají mít spinner místo alt textu */
.svc__stage,
.photoband,
.founders__slide,
.cenik__media-frame,
.bio__head{
  position:relative;
}

/* tmavý skeleton podklad + skrytí alt textu, dokud se fotka nenačte */
.svc__stage:not(.img-ready)::before,
.photoband:not(.img-ready)::before,
.founders__slide:not(.img-ready)::before,
.cenik__media-frame:not(.img-ready)::before,
.bio__head:not(.img-ready)::before{
  content:"";
  position:absolute; inset:0;
  z-index:2;
  /* světlejší modrošedý skeleton – čitelný na tmavém i světlém pozadí sekce */
  background:
    linear-gradient(135deg, rgba(159,208,244,.05) 0%, rgba(159,208,244,0) 60%),
    linear-gradient(160deg, #26374d 0%, #1a2739 100%);
  box-shadow:inset 0 0 0 1px rgba(159,208,244,.16);
  background-size:200% 100%, 100% 100%;
  animation:imgShimmer 1.5s ease-in-out infinite;
}
/* jemný světelný přejezd přes skeleton (shimmer) – posouvá první vrstvu gradientu */
@keyframes imgShimmer{ 0%{background-position:140% 0, 0 0} 100%{background-position:-140% 0, 0 0} }

/* otáčející se prémiové kolečko */
.svc__stage:not(.img-ready)::after,
.photoband:not(.img-ready)::after,
.founders__slide:not(.img-ready)::after,
.cenik__media-frame:not(.img-ready)::after,
.bio__head:not(.img-ready)::after{
  content:"";
  position:absolute; top:50%; left:50%;
  width:42px; height:42px; margin:-21px 0 0 -21px;
  z-index:4;
  border-radius:50%;
  border:3.5px solid rgba(255,255,255,.28);
  border-top-color:#9FD0F5;
  box-shadow:0 2px 10px rgba(0,0,0,.35);
  animation:imgSpin .75s linear infinite;
  pointer-events:none;
}
@keyframes imgSpin{ to{ transform:rotate(360deg); } }

/* dokud není načteno, skryjeme text alt (barva textu průhledná) */
.svc__stage:not(.img-ready) img,
.photoband:not(.img-ready) img,
.founders__slide:not(.img-ready) img,
.cenik__media-frame:not(.img-ready) img,
.bio__head:not(.img-ready) img{
  color:transparent !important;
  font-size:0 !important;
}

/* po načtení: fotka se jemně objeví */
.photoband.img-ready img,
.cenik__media-frame.img-ready img,
.bio__head.img-ready img{
  animation:imgFade .4s var(--ease) both;
}
/* galerie (.svc__stage) má vlastní opacity přepínání slidů – fade řešíme
   jen na jejím kontejneru, ne na jednotlivých <img>, ať se nerozbije slider */
.svc__stage.img-ready{ animation:imgFade .4s var(--ease) both; }
@keyframes imgFade{ from{ opacity:0; } to{ opacity:1; } }

/* ohled na uživatele s omezením pohybu */
@media (prefers-reduced-motion:reduce){
  .svc__stage:not(.img-ready)::after,
  .photoband:not(.img-ready)::after,
  .founders__slide:not(.img-ready)::after,
  .cenik__media-frame:not(.img-ready)::after,
  .bio__head:not(.img-ready)::after{ animation-duration:1.6s; }
  .photoband.img-ready img,.founders__slide.img-ready img,
  .cenik__media-frame.img-ready img,.bio__head.img-ready img{ animation:none; }
}