/* Sdilene upravy pro tri jazykove verze. Zachovavaji barvy a obrazky Advenio. */
*, *:before, *:after { box-sizing: border-box; }
body { font-size: 15px; line-height: 1.5; background-color: #f3f4f5; }
img { max-width: 100%; height: auto; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid #ef9b00; outline-offset: 2px; }
#page { width: min(100% - 32px, 1120px); margin: 0 auto; }
#header { width: 100%; height: auto; min-height: 112px; display: flex; align-items: center; gap: 22px; background-size: 100% 6px; }
#logo, #mainmenu, #others { float: none; width: auto; padding: 0; }
#logo { flex: 0 0 225px; }
#logo img { width: 225px; }
#mainmenu { flex: 1 1 auto; }
#mainmenu ul { display: flex; flex-wrap: wrap; gap: 4px 18px; width: auto; }
#mainmenu li { margin: 0; float: none; }
#mainmenu li a { display: block; padding: 10px 0; }
#others { display: flex; align-items: center; flex: 0 0 auto; }
#fb, #languages { float: none; margin: 0; }
#content1 { width: 100%; height: auto; display: flex; background: #292929; }
.theme { float: none; width: 66.666%; min-height: 280px; height: auto; background-size: cover !important; background-position: center !important; }
.theme[style*="weknowhow"] { background-size: contain !important; background-repeat: no-repeat !important; background-color: #fff; }
@media (min-width: 1024px) {
  /* Banner ma pomer 641:297: vyska podle sirky bez orezani nebo deformace. */
  .theme[style*="weknowhow"] { aspect-ratio: 641 / 297; min-height: 0; background-size: cover !important; }
}
.theme iframe { display: block; width: 100%; height: 280px; border: 0; }
#info { width: 33.333%; height: auto; min-height: 280px; float: none; padding: 22px 24px; }
#info h1 { color: #fff; }
#info a { color: #fff !important; }
#menus { width: 100%; height: auto; background: #171717; }
#menus .menu { display: flex; flex-wrap: wrap; gap: 0; float: none; padding: 5px 12px; }
#menus .menu li { float: none; margin: 0; padding: 0; border: 0; }
#menus .menu li a { display: block; padding: 10px 12px; color: #fff; }
#menus .menu li a:hover { background: #ba0000; text-decoration: none; }
#content2 { width: 100%; padding: 0; }
#content2:after, #onas:after, #kontakt:after, #reference:after { content: ''; display: table; clear: both; }
.services { width: 33.333%; height: auto; min-height: 270px; background-color: #232323; background-size: cover; }
.services .cn { width: 100%; height: auto; min-height: 190px; background-size: cover; background-position: center; }
.services .btn { width: 100%; height: auto; min-height: 75px; padding: 20px 24px; }
.project { width: 100%; height: auto !important; padding: 18px; background: #fff; border-bottom: 1px solid #e3e3e3; }
.project .image { width: 34%; padding-right: 16px; }
.project > div[style*="float"] { width: 34% !important; }
.project > div[style*="float"] .image { width: 100%; float: none; }
.project .text { width: 66%; height: auto !important; padding: 0; overflow-wrap: anywhere; }
.project .image img { max-width: 100%; height: auto; }
#kontakt, #onas { display: flex; flex-wrap: wrap; background: #fff; }
.block, .block2, .block3 { float: none; width: 33.333%; padding: 22px; margin: 0; min-height: 0; }
.block3 { width: 50%; }
.block2 { display: flex; gap: 12px; }
.block2 .image, .block2 .text { float: none; width: 50%; padding: 0; }
#prace { width: 66%; }
.prace { width: 100%; }
.prace .image { width: 22%; }
.prace .text { width: 78%; }
#kontaktni-formular { width: 34%; padding: 20px; }
.form input:not(.check):not(.button), .form select, .form textarea { max-width: 100%; }
#merchandising { width: 100%; height: auto; margin: 0; }
#merchandising ul.advenio-services-grid { width: 100%; height: auto; overflow: visible; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; padding: 20px 0; list-style: none; }
.advenio-services-grid .merch { float: none; width: auto; height: auto; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.07); }
.advenio-services-grid .merch-img { width: 100%; height: auto; aspect-ratio: 320 / 192; overflow: hidden; }
.advenio-services-grid .merch-img img { width: 100%; height: 100%; object-fit: cover; }
.advenio-services-grid .merch-button { margin: 0; }
.advenio-services-grid .merch-button a { width: 100%; height: auto; min-height: 66px; padding: 18px 20px; background: #242424; }
.advenio-services-grid .merch-content { padding: 20px; background: none; }
#footer { width: 100%; height: auto; min-height: 150px; padding: 22px 18px; background: #262626; color: #fff; }
#footer .ff { width: auto; padding: 0; margin: 0 20px 15px 0; float: none; display: inline-block; }
#footer .menu, #footer .submenu { float: none; display: flex; flex-wrap: wrap; gap: 10px 18px; padding: 0; margin: 0 0 12px; }
#footer .menu li, #footer .submenu li { float: none; border: 0; margin: 0; padding: 0; }
#footer .menu a, #footer .submenu a { color: #ddd; }
@media (max-width: 800px) {
  #page { width: min(100% - 24px, 700px); }
  #header { flex-wrap: wrap; gap: 6px 16px; padding: 15px 0 20px; }
  #logo { flex: 1 1 auto; } #logo img { width: 180px; }
  #mainmenu { order: 3; flex: 1 0 100%; }
  #mainmenu ul { gap: 0 16px; } #mainmenu li a { padding: 7px 0; }
  #content1 { flex-direction: column; }
  .theme { width: 100%; min-height: 210px; }
  .theme iframe { height: 210px; }
  #info { width: 100%; min-height: 0; }
  .services { width: 50%; }
  .block, .block2 { width: 50%; }
  #merchandising ul.advenio-services-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 520px) {
  body { font-size: 15px; }
  #page { width: calc(100% - 20px); }
  #logo img { width: 155px; }
  #mainmenu ul { gap: 0 12px; }
  #menus .menu { padding: 5px; }
  #menus .menu li a { padding: 8px; font-size: 12px; }
  .theme { min-height: 170px; }
  .services { width: 100%; min-height: 0; }
  .services .cn { min-height: 180px; }
  .services .btn { min-height: 0; padding: 16px 20px; }
  .project .image, .project .text, .project > div[style*="float"] { float: none !important; width: 100% !important; }
  .project .image { padding: 0 0 12px; }
  .project iframe { max-width: 100%; }
  .block, .block2, .block3 { width: 100%; }
  #prace, #kontaktni-formular { float: none; width: 100%; }
  #merchandising ul.advenio-services-grid { grid-template-columns: 1fr; }
  .form label, .form input:not(.check):not(.button), .form select, .form textarea { float: none; display: block; width: 100%; }
  #footer .ff { display: block; }
}



/* Mobilni menu: na desktopu zustava puvodni horni navigace. */
.public-menu-toggle { display:none; }
@media (max-width: 800px) {
  .public-menu-ready #header { position:relative; }
  .public-menu-ready .public-menu-toggle:not([hidden]) { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid #d0d4d8; border-radius:8px; background:#fff; color:#242424; min-height:42px; padding:0 12px; font:inherit; cursor:pointer; }
  .public-menu-icon { display:block; width:19px; height:14px; border-top:2px solid currentColor; border-bottom:2px solid currentColor; position:relative; }
  .public-menu-icon:after { content:''; position:absolute; top:5px; left:0; width:100%; border-top:2px solid currentColor; }
  .public-menu-ready #mainmenu { display:none; order:4; flex:1 0 100%; }
  .public-menu-ready #mainmenu.is-open { display:block; }
  .public-menu-ready #mainmenu ul { display:flex; flex-direction:column; gap:0; padding:6px 0; background:#fff; border:1px solid #e1e3e5; border-radius:8px; box-shadow:0 5px 18px rgba(0,0,0,.08); }
  .public-menu-ready #mainmenu li { width:100%; }
  .public-menu-ready #mainmenu li a { padding:10px 14px; }
  .public-menu-ready #mainmenu .sel a { color:#b40000; font-weight:bold; text-decoration:none; }
  .public-menu-ready #others { order:2; }
  .public-menu-ready .public-menu-toggle { order:3; }
  .public-menu-ready #logo { order:1; min-width:0; flex:1 1 auto; }
  #menus .menu { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:thin; }
  #menus .menu li { flex:0 0 auto; }
  #menus .menu li a { white-space:nowrap; }
}
@media (max-width: 520px) {
  .public-menu-ready #header { gap: 6px 8px; }
  .public-menu-ready #logo img { width: 125px; }
  .public-menu-ready .public-menu-toggle:not([hidden]) { width: 42px; padding: 0; }
  .public-menu-ready .public-menu-label { display:none; }
}
@media (max-width: 380px) {
  .public-menu-ready #fb { display:none; }
  .public-menu-ready #header { gap:6px 4px; }
  .public-menu-ready #logo { flex:1 1 105px; }
  .public-menu-ready #logo img { width:105px; }
  .public-menu-ready #others { flex:0 0 108px; }
  .public-menu-ready .public-menu-toggle:not([hidden]) { width:40px; flex:0 0 40px; }
}
