:root{--ink:#181818;--paper:#f6f6f2;--orange:#f75727;--line:#d6d6d1}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 'DM Sans',Arial,'Apple Symbols','Segoe UI Symbol','Noto Sans Symbols 2',sans-serif;font-variant-emoji:text}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;-webkit-appearance:none;appearance:none}a:focus-visible,button:focus-visible{outline:3px solid #315cf4;outline-offset:6px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #315cf4;outline-offset:2px}::selection{background:var(--orange);color:white}.skip{position:absolute;top:-100px}.skip:focus{top:0;z-index:9;background:white;padding:20px}header{display:flex;justify-content:space-between;align-items:center;margin:0 4.5%;padding:28px 0 24px;border-bottom:1px solid var(--line)}.brand{font-weight:700;font-size:23px;line-height:.92;letter-spacing:-1px;position:relative}.brand span{position:absolute;top:0;right:-15px;font-size:12px}nav{display:flex;gap:34px;align-items:center;font-size:14px}.nav-cta{background:var(--ink);color:white;padding:13px 20px;border-radius:28px}.hero{padding:26px 4.5% 34px;position:relative;overflow:hidden}.eyebrow{font-size:12px;letter-spacing:1.5px;font-weight:600}.hero>.eyebrow{display:flex;justify-content:space-between;flex-wrap:wrap;gap:5px 18px}.hero h1{font:800 clamp(100px,13.5vw,205px)/.86 'Barlow Condensed','Arial Narrow',Impact,sans-serif;letter-spacing:-3px;margin:37px 0 0;position:relative;z-index:1;pointer-events:none}.hero h1>span{color:var(--orange)}.orbit{height:490px;position:relative;max-width:1150px;margin:-153px auto 0}.portrait{position:absolute;left:37%;top:0;width:36%;height:460px;margin:0;z-index:2;transform:rotate(-4deg)}.portrait img{width:100%;height:100%;object-fit:cover;object-position:49% center;border-radius:49% 49% 6px 6px;box-shadow:14px 16px 0 #e2e2dc}.portrait figcaption{position:absolute;bottom:25px;left:-30px;background:var(--paper);padding:8px 17px;transform:rotate(1deg);font-size:14px}.orbit-line{position:absolute;left:7%;top:90px;width:92%;height:290px;border:1px solid #bbb;border-radius:50%;transform:rotate(-12deg)}.chip{position:absolute;z-index:3;border:1px solid var(--ink);background:var(--paper);border-radius:50px;padding:15px 20px;white-space:nowrap;display:flex;align-items:center;gap:14px;box-shadow:3px 4px 0 #181818;animation:float 6s ease-in-out infinite;transition:background .2s,color .2s}.chip:hover,.chip:focus-visible{background:var(--ink);color:white;animation-play-state:paused}.chip small{font-size:12px;opacity:.85}.chip b{font-size:21px;font-weight:400}.c1{left:7%;top:170px;--r:-8deg}.c2{right:1%;top:40px;--r:9deg;animation-delay:-2s}.c3{left:0;top:278px;--r:4deg;animation-delay:-4s}.c4{right:-1%;top:235px;--r:-7deg;animation-delay:-1s;background:var(--orange)}.c5{left:13%;top:405px;--r:-5deg;animation-delay:-3s}.c6{right:3%;top:365px;--r:7deg;animation-delay:-2s}.c7{right:6%;top:140px;--r:-4deg;animation-delay:-4s;background:var(--ink);color:white}.hero-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:15px;gap:25px}.hero-bottom p{font-size:clamp(22px,2.7vw,40px);letter-spacing:-1.6px;font-weight:600;margin:0}.hero-bottom>div{font-size:14px;line-height:1.6}.round{display:grid;place-items:center;min-width:56px;height:56px;border:1px solid var(--ink);border-radius:50%;font-size:25px}.ribbon{overflow:hidden;display:flex;justify-content:center;align-items:center;white-space:nowrap;background:var(--orange);padding:15px 0;transform:rotate(-2deg);width:100%;font:700 38px/1 'Barlow Condensed',Impact,sans-serif;margin:30px 0 0}.ribbon-track{display:flex;flex:none;width:max-content}.ribbon-group{display:flex;flex:none;gap:40px;align-items:center;padding-right:40px}.ribbon-copy{display:none}.ribbon-star{font-family:Arial,'Apple Symbols','Segoe UI Symbol',sans-serif;font-size:40px}.services,.start,.reference{padding:90px 6%}.section-top{display:flex;justify-content:space-between;gap:20px}.section-top>span:last-child{font-size:13px}h2{font-size:clamp(44px,6.5vw,88px);line-height:1.02;letter-spacing:-4px;font-weight:500;margin:40px 0 50px}h2 em{font-family:Georgia,serif;font-weight:400} .service-layout{display:grid;grid-template-columns:1.12fr 1fr;gap:7%}.service-options{border-top:1px solid var(--line)}.service-options button{border:0;border-bottom:1px solid var(--line);background:transparent;width:100%;display:flex;align-items:center;text-align:left;gap:19px;padding:22px 12px;font-size:18px;line-height:1.4;transition:background .2s}.service-options button>span{font-size:12px}.service-options button>b{margin-left:auto;font-size:23px;font-weight:400}.service-options button[aria-selected=true]{background:var(--ink);color:white}.service-options button:hover{background:#e5e5df}.service-options button[aria-selected=true]:hover{background:var(--ink)}#service-panel{background:var(--orange);padding:30px 34px;display:flex;flex-direction:column;min-height:550px;position:relative;border-radius:0 55px 0 0}.panel-meta{font-size:12px;letter-spacing:1px;display:flex;justify-content:space-between;gap:20px}.panel-meta span:last-child{font-size:19px}h3{font-size:35px;line-height:1.1;letter-spacing:-1.5px;margin:35px 0 16px}#service-panel>p{margin:0;font-size:17px;max-width:390px}.output{margin:30px 0}.output>span{font-size:11px;letter-spacing:1px;font-weight:700}.output ul{padding-left:19px;margin:12px 0 0}.output li{margin:5px 0}.button{padding:15px 20px;display:flex;justify-content:space-between;align-items:center;gap:25px}.dark{background:var(--ink);color:white;margin-top:auto}.manifesto{background:var(--ink);color:var(--paper);padding:55px 6% 60px}.manifesto h2{font:700 clamp(70px,11vw,158px)/.91 'Barlow Condensed',Impact,sans-serif;letter-spacing:-2px;margin:70px 0 50px}.manifesto h2>span{color:var(--orange)}.manifesto-bottom{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:start;max-width:1040px;margin:0 0 65px auto}.asterisk{font-size:210px;line-height:1;color:var(--orange);text-align:center}.manifesto-bottom h3{margin:0 0 25px;font-size:35px}.manifesto-bottom p{color:#c1c1bc;max-width:460px}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;border-top:1px solid #494945;padding-top:30px}.principles span{font-size:12px;letter-spacing:1px;color:#aaa}.principles p{font-size:25px;line-height:1.3;letter-spacing:-.7px}.reference{padding-top:80px;padding-bottom:85px;position:relative}.quote-mark{font:150px/1 Georgia,serif;color:var(--orange);height:80px;margin-top:35px}.reference blockquote{margin:0 0 35px;max-width:1000px;font-size:clamp(28px,3.7vw,53px);line-height:1.2;letter-spacing:-1.8px}.quote-author{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:24px}.quote-author small{font-size:13px;color:#61615c}.wordmark{font-size:32px;font-weight:700;letter-spacing:-2px}.wordmark span{color:var(--orange);margin-left:10px}.start{padding-top:55px;border-top:1px solid var(--line)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.steps article{border-top:1px solid var(--ink);padding-top:20px}.steps article>span{font:600 58px/1 'Barlow Condensed',Impact,sans-serif;color:var(--orange)}.steps h3{font-size:25px;margin:28px 0 16px;letter-spacing:-.8px}.steps p{color:#62625b}footer{background:var(--orange);padding:40px 6% 22px}footer h2{font:700 clamp(64px,10.2vw,148px)/.95 'Barlow Condensed',Impact,sans-serif;letter-spacing:-2px;margin:70px 0 40px}footer h2 a{border-bottom:4px solid var(--ink)}footer h2 a:hover{color:white}footer h2 a>span{font-family:Arial;font-weight:400}.contact-row{display:flex;justify-content:space-between;gap:25px;margin:45px 0 65px}.contact-row p{font-size:18px}.contact-row>div{display:flex;flex-direction:column;font-size:24px;justify-content:center}.contact-row a:hover{text-decoration:underline}.footer-bottom{border-top:1px solid #a93615;display:flex;justify-content:space-between;gap:20px;padding-top:22px;font-size:12px}@keyframes float{0%,100%{transform:translateY(0) rotate(var(--r))}50%{transform:translateY(-9px) rotate(var(--r))}}@media(min-width:1500px){body{max-width:1700px;margin:auto}.hero h1{font-size:205px}}@media(max-width:1000px){.orbit{margin:-75px auto 0;height:465px}.portrait{left:30%;width:42%;height:420px}.chip{padding:11px 14px;gap:9px;font-size:14px}.c1{left:0;top:110px}.c2{top:15px;right:0}.c3{top:240px}.c4{top:210px}.c5{left:4%;top:380px}.c6{right:0;top:345px}.c7{top:110px;right:0}.hero-bottom>div{max-width:260px}.service-layout{gap:4%;grid-template-columns:1fr 1fr}.service-options button{font-size:16px;padding:20px 8px;gap:10px}#service-panel{padding:25px}.manifesto-bottom{gap:5%}}@media(max-width:650px){header{padding:22px 0}.brand{font-size:20px}nav{gap:12px}nav>a:not(.nav-cta){display:none}.nav-cta{font-size:12px;padding:11px 15px}.hero{padding-top:20px}.hero>.eyebrow{font-size:10px}.hero>.eyebrow>span:last-child{display:none}.hero h1{font-size:24vw;letter-spacing:-2px;margin-top:28px}.orbit{height:540px;margin:25px 0 0}.portrait{left:20%;width:63%;height:310px}.portrait img{object-position:49% center}.portrait figcaption{left:-20px;bottom:20px;font-size:12px}.orbit-line{left:0;width:100%;top:80px;height:170px}.chip{font-size:12px;padding:9px 10px;gap:8px;box-shadow:2px 3px 0 #181818}.chip small{font-size:10px}.chip b{font-size:17px}.c1{top:280px;left:0}.c2{top:344px;right:0}.c3{top:412px;left:0}.c4{top:215px;right:0}.c5{top:477px;left:18%}.c6{top:412px;right:0}.c7{top:344px;left:0;right:auto}.hero-bottom{display:grid;grid-template-columns:1fr 50px;margin-top:0;gap:10px}.hero-bottom p{font-size:26px;letter-spacing:-1px}.hero-bottom>div{font-size:14px;grid-column:1;max-width:100%}.hero-bottom .round{grid-column:2;grid-row:1/3;min-width:46px;height:46px}.ribbon{font-size:29px;padding:12px 0;justify-content:flex-start}.ribbon-group{gap:24px;padding-right:24px}.ribbon-star{font-size:30px}.services,.reference,.start{padding:60px 5%}.section-top>span:last-child{display:none}h2{letter-spacing:-2px;margin:30px 0 35px;font-size:46px}.service-layout{display:flex;flex-direction:column;gap:28px}.service-options button{font-size:16px;padding:18px 12px}.service-options button>span{font-size:11px}#service-panel{min-height:530px;padding:28px;border-radius:0 40px 0 0;scroll-margin-top:20px}.manifesto{padding:35px 5% 30px}.manifesto h2{font-size:19vw;letter-spacing:-1px;margin:45px 0}.manifesto-bottom{display:block;margin-bottom:40px}.asterisk{display:block;font-size:100px;text-align:left;margin-bottom:20px}.manifesto-bottom h3{font-size:32px}.principles{display:block;padding-top:10px}.principles>div{padding-top:20px}.principles p{font-size:24px;margin:12px 0 25px}.reference blockquote{font-size:30px;letter-spacing:-1px}.quote-author{gap:15px}.wordmark{font-size:23px;letter-spacing:-1px}.quote-author small{font-size:11px}.quote-author>span:first-child{font-size:14px}.steps{display:block}.steps article{padding:25px 0 20px}.steps h3{margin-top:20px}.contact-row{display:block;margin:35px 0 45px}.contact-row>div{font-size:20px;gap:7px}.footer-bottom{flex-wrap:wrap;font-size:11px}.footer-bottom>span:nth-child(2){display:none}footer{padding:30px 5% 22px}footer h2{font-size:17vw;letter-spacing:-1px;margin:45px 0}footer h2 a{border-bottom-width:2px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.chip{animation:none}*{transition:none!important}}

/* ---------- pomocné ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
a.wordmark{display:inline-flex;align-items:center;border-bottom:2px solid transparent;transition:border-color .2s,color .2s}
a.wordmark:hover,a.wordmark:focus-visible{border-bottom-color:var(--ink)}

/* ---------- kontaktní formulář ---------- */
.contact-form{margin:0 0 58px;border-top:1px solid #a93615;padding-top:30px}
.form-top{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin-bottom:26px;max-width:820px}
.form-top>span:last-child{font-size:13px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px;max-width:820px}
.field{display:flex;flex-direction:column;gap:7px;margin:0}
.field-wide{grid-column:1/-1}
.field label{font-size:12px;letter-spacing:.6px;font-weight:600}
.field .optional{font-weight:400;letter-spacing:0}
.field input,.field select,.field textarea{font:16px/1.5 'DM Sans',Arial,sans-serif;color:var(--ink);background:var(--paper);border:1px solid var(--ink);border-radius:0;padding:13px 14px;width:100%;transition:box-shadow .2s}
.field textarea{resize:vertical;min-height:112px}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 19px) 22px,calc(100% - 14px) 22px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:40px;cursor:pointer}
.field input::placeholder,.field textarea::placeholder{color:#8a8a84}
.field input:hover,.field select:hover,.field textarea:hover{box-shadow:3px 3px 0 rgba(24,24,24,.22)}
.field [aria-invalid=true]{box-shadow:inset 0 0 0 1px var(--ink);background:#fff2ee}
.field-error{font-size:13px;font-weight:600}
.field-hint{font-size:12px;opacity:.78}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:26px}
#cf-submit{margin-top:0;border:0;min-width:238px;transition:opacity .2s,background .2s}
#cf-submit:hover:not(:disabled){background:#000}
#cf-submit:disabled{opacity:.6;cursor:progress}
.form-alert{font-size:14px;font-weight:600;max-width:420px;border-left:3px solid var(--ink);padding-left:12px}
.form-done{max-width:560px}
.form-done-title{font:700 34px/1.1 'Barlow Condensed',Impact,sans-serif;letter-spacing:-1px;margin:0 0 10px}
.form-done-text{margin:0 0 22px;font-size:17px}
.form-done-text a{border-bottom:1px solid var(--ink)}
.form-again{background:transparent;border:1px solid var(--ink);padding:12px 18px;font-size:14px;font-weight:600;transition:background .2s,color .2s}
.form-again:hover{background:var(--ink);color:#fff}

@media(max-width:900px){
  .form-grid{grid-template-columns:1fr;gap:18px}
  .form-top{flex-direction:column;gap:6px}
}
@media(max-width:650px){
  .contact-form{margin-bottom:42px;padding-top:26px}
  .form-top>span:last-child{display:block;font-size:13px}
  #cf-submit{width:100%;min-width:0}
  .form-foot{gap:16px;margin-top:22px}
  .form-alert{max-width:100%}
}
.field.prefilled select{animation:prefill 1.8s ease-out 1}
@keyframes prefill{0%,42%{box-shadow:0 0 0 3px var(--ink)}100%{box-shadow:0 0 0 0 transparent}}
@media(prefers-reduced-motion:reduce){.field.prefilled select{animation:none;box-shadow:0 0 0 2px var(--ink)}}

/* ---------- opravy responzivity ---------- */
/* Nakloněný .ribbon přetékal o 1 px a vyráběl vodorovný posuvník. */
html,body{overflow-x:clip}

/* Popisek fotky se křížil s chipy: od tabletu dolů ho posouváme pod portrét,
   na mobilu k jeho pravé hraně, kde žádný chip neleží. */
@media(max-width:1100px){
  .portrait figcaption{left:50%;bottom:-16px;transform:translateX(-50%) rotate(1deg);white-space:nowrap}
}
@media(max-width:650px){
  .portrait figcaption{left:auto;right:-8px;top:10px;bottom:auto;transform:rotate(1deg)}
  /* Pohodlnější dotykové cíle v patičce. */
  .contact-row>div a{padding:6px 0}
  .footer-bottom a{padding:8px 0}
}

/* Na mobilu se „↗" lámalo na vlastní řádek i s podtržením. */
@media(max-width:650px){
  footer h2{font-size:14.2vw}
  footer h2 a{white-space:nowrap}
}

/* [hidden] musí přebít display:grid/flex, jinak zůstanou skryté prvky vidět. */
[hidden]{display:none!important}

/* Na telefonu se pás plynule posouvá; kopie skupiny dělá smyčku beze švu. */
@media(max-width:650px){
  .ribbon-copy{display:flex}
  .ribbon-track{animation:ribbon-scroll 22s linear infinite;will-change:transform}
}
@keyframes ribbon-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ribbon-track{animation:none}}

@media(max-width:359px){
  .orbit{height:605px}
  .c6{top:540px;left:0;right:auto}
}

/* ---------- Shoptet Partner v sekci s referencí ---------- */
/* Druhý řádek pod .quote-author se stejným rytmem: popisek vlevo,
   značka vpravo, oddělené vlasovou linkou. Ze samotné citace se tím
   stává důkazní blok. */
.credential{display:flex;justify-content:space-between;align-items:center;gap:20px;
  border-top:1px solid var(--line);padding-top:24px;margin-top:26px}
.credential small{font-size:13px;color:#61615c}

/* font-weight:700 není kosmetika: drží oranžovou šipku nad hranicí
   velkého textu (18.66px bold), kde jí stačí kontrast 3:1. */
.partner{display:inline-flex;align-items:center;gap:10px;font-weight:700}

.partner-logo{height:46px;width:auto;display:block}
.partner-mark{color:var(--orange);font-size:30px;line-height:1}
/* Plnobarevné logo se do tříbarevné palety nevejde — tohle ho zavře
   do papírové dlaždice, aby četlo jako cizí předmět položený na stránku.
   Nasadit až podle brand manuálu Shoptetu. */
.partner-boxed{display:block;border:1px solid var(--ink);box-shadow:3px 4px 0 var(--ink);
  line-height:0;transition:box-shadow .2s,transform .2s}
a.partner:hover .partner-boxed,a.partner:focus-visible .partner-boxed{
  box-shadow:5px 6px 0 var(--ink);transform:translate(-2px,-2px)}


@media(max-width:650px){
  .credential{gap:15px;padding-top:20px;margin-top:20px}
  .credential>span:first-child{font-size:14px}
  .credential small{font-size:11px}
  .partner-logo{height:34px}
  .partner-mark{font-size:23px}
}

/* ---------- textová stránka (ochrana osobních údajů) ---------- */
.legal{padding:60px 6% 80px;max-width:760px}
.legal h1{font:700 clamp(46px,7vw,86px)/.98 'Barlow Condensed',Impact,sans-serif;
  letter-spacing:-2px;margin:28px 0 34px}
.legal h1 em{font-family:Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-1px}
.legal h2{font-size:26px;line-height:1.2;letter-spacing:-.8px;font-weight:600;margin:0 0 14px}
.legal section{border-top:1px solid var(--line);padding-top:26px;margin-top:34px}
.legal p{margin:0 0 14px;font-size:17px;line-height:1.65}
.legal-lead{font-size:21px;line-height:1.5;letter-spacing:-.3px;max-width:640px}
.legal ul{padding-left:20px;margin:0 0 14px}
.legal li{margin:7px 0;font-size:17px;line-height:1.6}
.legal a{border-bottom:1px solid var(--ink)}
.legal a:hover{color:var(--orange);border-bottom-color:var(--orange)}
.legal-date{margin-top:40px;font-size:13px;color:#61615c}
.legal-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  border-top:1px solid var(--line);margin:0 6%;padding:24px 0 30px;font-size:13px}
.legal-footer a{border-bottom:1px solid transparent}
.legal-footer a:hover{border-bottom-color:var(--ink)}

@media(max-width:650px){
  .legal{padding:40px 5% 60px}
  .legal h2{font-size:22px}
  .legal-lead{font-size:18px}
  .legal p,.legal li{font-size:16px}
  .legal-footer{margin:0 5%}
}
.form-note{font-size:13px;margin:14px 0 0;max-width:560px}
.form-note a{border-bottom:1px solid var(--ink)}
.form-note a:hover{border-bottom-color:transparent}
