/* PRVNÍ SEKRETARIÁT v4 – style.css */
:root {
  --brand-yellow: hsl(47,97%,50%);
  --brand-yellow-15: hsla(47,97%,50%,0.15);
  --brand-yellow-20: hsla(47,97%,50%,0.2);
  --brand-yellow-text: hsl(38,90%,36%);
  --brand-ink: hsl(0,0%,6%);
  --brand-gray: hsl(0,0%,44%);
  --brand-surface: hsl(0,0%,97%);
  --brand-border: hsl(0,0%,90%);
  --font: 'Plus Jakarta Sans', system-ui, sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font);color:var(--brand-ink);background:#fff;line-height:1.6;overflow-x:hidden}
a{text-decoration:none;color:inherit}a:hover{text-decoration:none}
button{cursor:pointer;border:none;font-family:inherit;background:none}
ul{list-style:none}img{max-width:100%;display:block}
.container{max-width:1280px;margin:0 auto;padding:0 1.25rem}
@media(min-width:1024px){.container{padding:0 2.5rem}}
.fade-up{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.fade-up.visible{opacity:1;transform:translateY(0)}
.fade-up-d1{transition-delay:.1s}.fade-up-d2{transition-delay:.2s}.fade-up-d3{transition-delay:.3s}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee-track{display:flex;gap:1rem;width:max-content;animation:marquee 40s linear infinite}
.marquee-track:hover{animation-play-state:paused}
.pill{display:inline-flex;align-items:center;gap:.375rem;background:var(--brand-yellow-15);border-radius:9999px;padding:.25rem .625rem;margin-bottom:1rem}
.pill-dot{width:6px;height:6px;border-radius:50%;background:var(--brand-yellow-text);flex-shrink:0}
.pill-text{font-size:.625rem;font-weight:700;color:var(--brand-yellow-text);letter-spacing:.18em;text-transform:uppercase}
.btn-yellow{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--brand-yellow);color:var(--brand-ink);font-weight:700;font-size:.875rem;padding:.875rem 1.75rem;border-radius:9999px;transition:background .2s}
.btn-yellow:hover{background:hsl(47,97%,55%)}
.btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:1px solid var(--brand-border);background:#fff;color:var(--brand-ink);font-weight:600;font-size:.875rem;padding:.875rem 1.75rem;border-radius:9999px;transition:all .2s}
.btn-outline:hover{background:var(--brand-surface);border-color:hsla(0,0%,6%,.2)}
.btn-outline-sm{padding:.75rem 1.5rem;font-weight:700}
.section-title{font-size:clamp(1.5rem,4vw,2.5rem);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.feature-badge{display:inline-flex;align-items:center;gap:.375rem;font-size:.6875rem;font-weight:600;color:var(--brand-gray)}
.feature-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--brand-yellow);flex-shrink:0}
/* Header */
.header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--brand-border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{display:flex;align-items:center;gap:.625rem}
.logo-bar{width:4px;height:44px;background:var(--brand-yellow);border-radius:9999px;flex-shrink:0}
.logo-text{display:flex;flex-direction:column;gap:5px;line-height:1}
.logo-label{font-weight:600;text-transform:uppercase;font-size:.875rem;color:hsla(0,0%,6%,.55);letter-spacing:.18em}
.logo-name{font-weight:800;text-transform:uppercase;font-size:1rem;color:var(--brand-ink);letter-spacing:.07em}
.logo--inverted .logo-label{color:rgba(255,255,255,.55)}.logo--inverted .logo-name{color:#fff}
.logo--sm .logo-bar{height:36px;width:3px}.logo--sm .logo-label{font-size:.75rem}.logo--sm .logo-name{font-size:.84rem}
.desktop-nav{display:none;align-items:center;gap:.25rem}
@media(min-width:768px){.desktop-nav{display:flex}}
.desktop-nav a,.desktop-nav button{font-size:.875rem;color:var(--brand-gray);font-weight:500;padding:.5rem 1rem;border-radius:9999px;transition:all .2s}
.desktop-nav a:hover,.desktop-nav button:hover{color:var(--brand-ink);background:var(--brand-surface)}
.dropdown-wrap{position:relative}
.dropdown-panel{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:.5rem;width:256px;background:#fff;border:1px solid var(--brand-border);border-radius:1rem;box-shadow:0 16px 48px rgba(0,0,0,.1);z-index:50;overflow:hidden}
.dropdown-wrap.open .dropdown-panel{display:block}
.dropdown-panel a{display:flex;flex-direction:column;padding:.625rem .75rem;border-radius:.75rem;margin:.5rem;transition:background .2s}
.dropdown-panel a:hover{background:var(--brand-surface)}
.dropdown-panel .link-label{font-size:.875rem;font-weight:600;color:var(--brand-ink);margin-bottom:.125rem}
.dropdown-panel .link-desc{font-size:.75rem;color:var(--brand-gray)}
.dropdown-footer{border-top:1px solid var(--brand-border);padding:.625rem .75rem}
.dropdown-footer a{display:inline-flex;align-items:center;gap:.25rem;font-size:.75rem;font-weight:700;color:var(--brand-gray);padding:0;margin:0;border-radius:0}
.dropdown-footer a:hover{color:var(--brand-ink);background:none}
.dropdown-arrow{width:12px;height:12px;transition:transform .2s}
.dropdown-wrap.open .dropdown-arrow{transform:rotate(180deg)}
.mobile-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;width:40px;height:40px;gap:6px}
.mobile-toggle span{display:block;width:20px;height:2px;background:var(--brand-ink);transition:all .3s}
.mobile-toggle.open span:nth-child(1){transform:rotate(45deg) translateY(8px)}
.mobile-toggle.open span:nth-child(2){opacity:0}
.mobile-toggle.open span:nth-child(3){transform:rotate(-45deg) translateY(-8px)}
@media(min-width:768px){.mobile-toggle{display:none}}
.mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--brand-border);box-shadow:0 16px 48px rgba(0,0,0,.1);z-index:50}
.mobile-menu.open{display:block}
.mobile-menu a,.mobile-menu button{display:block;width:100%;text-align:left;padding:.75rem 1.25rem;font-size:.875rem;font-weight:600;color:var(--brand-ink);transition:background .2s}
.mobile-menu a:hover,.mobile-menu button:hover{background:var(--brand-surface)}
.mobile-services{background:var(--brand-surface);border-top:1px solid hsla(0,0%,90%,.6);border-bottom:1px solid hsla(0,0%,90%,.6)}
.mobile-services a{padding-left:2rem;font-weight:500;color:var(--brand-gray);display:flex;align-items:center;gap:.5rem}
.mobile-services a::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--brand-yellow)}
.mobile-contact{border-top:1px solid var(--brand-border);padding:.75rem 1.25rem}
.mobile-contact a{padding:.25rem 0;font-weight:500;color:var(--brand-gray);font-size:.875rem}
/* Hero */
.hero{position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 80% 60% at 60% -10%,hsla(47,97%,50%,.10) 0%,transparent 70%),radial-gradient(ellipse 50% 40% at 0% 100%,hsla(47,97%,50%,.06) 0%,transparent 60%)}
.hero-dots{position:absolute;inset:0;pointer-events:none;opacity:.4;background-image:radial-gradient(circle,var(--brand-border) 1px,transparent 1px);background-size:28px 28px}
.hero-content{position:relative;padding:3.5rem 0 3rem}
@media(min-width:1024px){.hero-content{padding:7rem 0 6rem}}
.hero-grid{display:grid;grid-template-columns:1fr;gap:3rem;align-items:stretch}
@media(min-width:1024px){.hero-grid{grid-template-columns:1fr 1.15fr;gap:4rem}}
.hero-text{display:flex;flex-direction:column;justify-content:center}
.hero h1{font-size:clamp(2.2rem,6vw,4.5rem);font-weight:800;line-height:1.04;letter-spacing:-.02em;margin-bottom:1.5rem}
.hero-sub{font-size:1.125rem;color:var(--brand-gray);line-height:1.7;margin-bottom:2.5rem;max-width:480px}
.hero-ctas{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2.5rem}
@media(min-width:640px){.hero-ctas{flex-direction:row;flex-wrap:wrap}}
.hero-trust{display:flex;flex-wrap:wrap;gap:1.25rem}
.trust-item{display:flex;align-items:center;gap:.375rem;font-size:.875rem;color:var(--brand-gray)}
.trust-check{width:16px;height:16px;border-radius:50%;background:var(--brand-yellow-20);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hero-visual{display:none;position:relative;min-height:520px}
@media(min-width:1024px){.hero-visual{display:flex;flex-direction:column}}
.hero-img-wrap{position:relative;flex:1;border-radius:1.5rem;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.12)}
.hero-img{width:100%;height:100%;object-fit:cover;object-position:top;filter:brightness(1.05) saturate(1.15) sepia(.22)}
.hero-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.2),transparent)}
.hero-stat-chip{position:absolute;top:-16px;right:-16px;background:#fff;border:1px solid var(--brand-border);border-radius:1rem;padding:.75rem 1rem;box-shadow:0 4px 16px rgba(0,0,0,.08)}
.hero-stat-chip p:first-child{font-size:1.5rem;font-weight:900;line-height:1}
.hero-stat-chip p:last-child{font-size:.75rem;color:var(--brand-gray);font-weight:500;margin-top:.125rem}
.hero-divider{height:1px;background:var(--brand-border)}
/* Stats */
.stats-bar{background:var(--brand-surface);border-bottom:1px solid var(--brand-border);padding:2.5rem 0}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;text-align:center}
@media(min-width:768px){.stats-grid{grid-template-columns:repeat(4,1fr)}}
.stat-num{font-size:clamp(1.875rem,4vw,2.5rem);font-weight:900;letter-spacing:-.02em}
.stat-label{font-size:.875rem;color:var(--brand-gray);font-weight:500;margin-top:.25rem}
/* Reviews */
.reviews{background:#fff;border-bottom:1px solid var(--brand-border);padding:3.5rem 0;overflow:hidden}
.reviews-header{margin-bottom:2.5rem}
.reviews-title-row{display:flex;flex-wrap:wrap;align-items:center;gap:1rem}
.rating-row{display:flex;align-items:center;gap:.5rem;padding-bottom:.25rem}
.rating-stars{display:flex;align-items:center;gap:2px}
.rating-num{font-size:1.25rem;font-weight:800}
.review-card{background:var(--brand-surface);border-radius:1rem;border:1px solid var(--brand-border);padding:1.5rem;display:flex;flex-direction:column;gap:1rem;width:320px;flex-shrink:0}
.review-card .stars{display:flex;gap:2px}
.review-card p{font-size:.875rem;line-height:1.6}
/* Services */
.service-section{border-top:1px solid var(--brand-border)}
.service-section--alt{background:var(--brand-surface)}
.service-inner{padding:3.5rem 0}
@media(min-width:1024px){.service-inner{padding:7rem 0}}
.service-grid{display:grid;grid-template-columns:1fr;gap:3rem;align-items:center}
@media(min-width:1024px){.service-grid{grid-template-columns:1fr 1fr;gap:5rem}}
.service-grid--reverse .service-text{order:1}.service-grid--reverse .service-mockup{order:2}
@media(min-width:1024px){.service-grid--reverse .service-text{order:2}.service-grid--reverse .service-mockup{order:1}}
.service-text p{font-size:1rem;color:var(--brand-gray);line-height:1.7;margin-bottom:2rem;max-width:448px}
.service-badges{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem}
/* Mockups */
.mockup{background:#fff;border-radius:1.5rem;box-shadow:0 32px 80px rgba(0,0,0,.10);border:1px solid hsla(0,0%,90%,.4);overflow:hidden}
.mockup-chrome{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:var(--brand-surface);border-bottom:1px solid var(--brand-border)}
.mockup-dots{display:flex;gap:6px;flex-shrink:0}
.mockup-dot{width:10px;height:10px;border-radius:50%}
.mockup-dot--r{background:#ff5f57}.mockup-dot--y{background:#febc2e}.mockup-dot--g{background:#28c840}
.mockup-url{flex:1;margin:0 .75rem;height:20px;border-radius:9999px;background:var(--brand-border);display:flex;align-items:center;padding:0 .75rem}
.mockup-url span{font-size:.625rem;color:var(--brand-gray);font-family:monospace}
.mockup-chrome-label{font-size:.625rem;font-weight:600;color:var(--brand-gray)}
.mockup-chrome-badge{margin-left:auto;font-size:.625rem;font-weight:900;background:var(--brand-yellow-20);color:var(--brand-ink);border-radius:9999px;padding:.375rem .75rem;border:1px solid hsla(47,97%,50%,.35)}
.mockup-body{padding:1.5rem}
.bar-chart{display:flex;align-items:flex-end;gap:6px;height:96px;margin-bottom:1.25rem}
.bar-chart-bar{flex:1;border-radius:4px 4px 0 0}
.chip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.chip{background:var(--brand-surface);border-radius:.75rem;padding:.75rem}
.chip-val{font-size:.75rem;font-weight:900}.chip-label{font-size:.625rem;color:var(--brand-gray);margin-top:.125rem}
.doc-row{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.75rem;transition:background .2s;cursor:default}
.doc-row:hover{background:hsla(0,0%,97%,.7)}
.doc-icon{width:32px;height:32px;border-radius:.5rem;background:var(--brand-yellow-20);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.doc-name{font-size:.6875rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-meta{font-size:.625rem;color:var(--brand-gray)}
.doc-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.code-body{padding:1.25rem;font-family:'SF Mono','Fira Code',monospace;font-size:.6875rem;line-height:1.8}
.code-footer{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:var(--brand-surface);border-top:1px solid var(--brand-border)}
.code-footer span{font-size:.625rem;color:var(--brand-gray);font-family:monospace}
.code-status{width:8px;height:8px;border-radius:50%;background:#4ade80}
.task-row{display:flex;align-items:center;gap:.75rem;padding:.625rem;border-radius:.75rem;transition:background .2s;cursor:default}
.task-row:hover{background:hsla(0,0%,97%,.5)}
.task-check{width:16px;height:16px;border-radius:.25rem;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.task-check--done{background:var(--brand-yellow)}.task-check--pending{border:2px solid var(--brand-border)}
.task-label{font-size:.6875rem;flex:1}
.task-label--done{text-decoration:line-through;color:var(--brand-gray)}.task-label--pending{font-weight:500}
.task-day{font-size:.625rem;color:var(--brand-gray);background:var(--brand-surface);border-radius:.375rem;padding:.125rem .5rem;font-weight:500;flex-shrink:0}
.task-progress{padding-top:.75rem;border-top:1px solid var(--brand-border);margin-top:.25rem}
.task-progress-header{display:flex;justify-content:space-between;font-size:.625rem;color:var(--brand-gray);margin-bottom:.375rem}
.task-progress-header strong{color:var(--brand-ink);font-weight:700}
.progress-track{height:6px;background:var(--brand-surface);border-radius:9999px}
.progress-fill{height:100%;background:var(--brand-yellow);border-radius:9999px}
/* Why us */
.why-section{background:#fff;border-top:1px solid var(--brand-border)}
.why-inner{padding:3.5rem 0}@media(min-width:1024px){.why-inner{padding:7rem 0}}
.why-grid{display:grid;grid-template-columns:1fr;gap:3rem;align-items:stretch}
@media(min-width:1024px){.why-grid{grid-template-columns:1fr 1fr;gap:5rem}}
.why-image{position:relative;min-height:260px;border-radius:1.5rem;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.10)}
@media(min-width:1024px){.why-image{min-height:420px}}
.why-image img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.reason-card{display:flex;gap:.75rem;align-items:flex-start;padding:1rem;border-radius:.75rem;border:1px solid var(--brand-border);background:hsla(0,0%,97%,.5);transition:background .2s}
.reason-card:hover{background:var(--brand-surface)}
.reason-check{width:24px;height:24px;border-radius:50%;background:var(--brand-yellow);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.reason-card h4{font-size:.875rem;font-weight:700;margin-bottom:.125rem}
.reason-card p{font-size:.875rem;color:var(--brand-gray);line-height:1.6}
.reasons-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}
/* Process */
.process-section{background:var(--brand-surface);border-top:1px solid var(--brand-border);padding:3.5rem 0}
@media(min-width:1024px){.process-section{padding:5rem 0}}
.process-grid{display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:640px){.process-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.process-grid{grid-template-columns:repeat(4,1fr)}}
.step-card{position:relative;background:#fff;border:1px solid var(--brand-border);border-radius:1rem;padding:1.5rem;overflow:hidden;transition:all .2s}
.step-card:hover{border-color:hsla(47,97%,50%,.5);box-shadow:0 8px 32px rgba(0,0,0,.07)}
.step-bg-num{position:absolute;top:-8px;right:-4px;font-size:5rem;font-weight:900;line-height:1;color:hsla(0,0%,6%,.035);pointer-events:none;user-select:none}
.step-card h3{font-size:1rem;font-weight:800;margin-bottom:.5rem}
.step-card p{font-size:.875rem;color:var(--brand-gray);line-height:1.6}
/* Contact */
.contact-section{background:#fff;border-top:1px solid var(--brand-border)}
.contact-inner{padding:3.5rem 0}@media(min-width:1024px){.contact-inner{padding:7rem 0}}
.contact-grid{display:grid;grid-template-columns:1fr;gap:3rem;align-items:center}
@media(min-width:1024px){.contact-grid{grid-template-columns:1fr 1fr;gap:5rem}}
.contact-ctas{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2.5rem}
@media(min-width:640px){.contact-ctas{flex-direction:row}}
.info-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:.75rem 0;border-bottom:1px solid var(--brand-border);gap:.25rem 1rem}
.info-key{font-size:.875rem;color:var(--brand-gray);font-weight:500}
.info-val{font-size:.875rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:.375rem;transition:color .2s}
.info-val:hover{color:var(--brand-yellow-text)}
.copy-icon{opacity:.4;transition:opacity .2s}.info-val:hover .copy-icon{opacity:1}
.map-wrap{border-radius:1.5rem;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.10);border:1px solid hsla(0,0%,90%,.4);height:300px}
@media(min-width:640px){.map-wrap{height:400px}}@media(min-width:1024px){.map-wrap{height:480px}}
.map-wrap iframe{width:100%;height:100%;border:0;filter:grayscale(100%)}
/* Footer */
.footer{background:var(--brand-ink);padding:2rem 0;border-top:1px solid rgba(255,255,255,.05)}
.footer-desktop{display:none;align-items:center;justify-content:space-between;gap:2rem}
@media(min-width:1024px){.footer-desktop{display:flex}}
.footer-mobile{display:flex;flex-direction:column;gap:2rem}
@media(min-width:1024px){.footer-mobile{display:none}}
.footer-nav{display:flex;flex-wrap:wrap;align-items:center;gap:1.25rem}
.footer-nav a{font-size:.75rem;color:rgba(255,255,255,.4);white-space:nowrap;transition:color .2s}
.footer-nav a:hover{color:#fff}
.footer-nav-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem 1.5rem}
.footer-nav-grid a{font-size:.75rem;color:rgba(255,255,255,.4);transition:color .2s}
.footer-nav-grid a:hover{color:#fff}
.footer-copy{font-size:.75rem;color:rgba(255,255,255,.25);white-space:nowrap}
