/* Page-specific supplements — delicato-online.de (restored) */
/* Точечные добавки; широких переопределений фона/текста секций здесь нет. */
img { max-width: 100%; height: auto; }
table { border-collapse: collapse; }
th, td { padding: 4px 10px; }

/* Responsive layout for phones and small tablets */
*, *::before, *::after { box-sizing: border-box; }

@media (max-width: 700px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  body { font-size: 16px; line-height: 1.5; }

  #page_wrapper,
  #head_wrapper,
  #keyvisual,
  #content_wrapper,
  #content,
  #cm_navigation > ul {
    width: 100%;
    max-width: 100%;
  }

  #page_wrapper { margin: 0 auto; }
  #head_wrapper { height: 92px; }
  #logo { width: 100%; height: 92px; background-size: contain; background-position: center; background-repeat: no-repeat; }
  #title_wrapper { margin-left: 12px; }

  #keyvisual {
    height: 160px;
    background-size: auto 100% !important;
    background-position: center !important;
    background-repeat: no-repeat;
  }

  #cm_navigation { position: relative; }
  .mobile-nav-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px;
    border: 0;
    cursor: pointer;
    font: inherit;
    font-weight: bold;
  }
  #cm_navigation > ul { display: none; }
  #cm_navigation.mobile-nav-open > ul { display: block; }
  #cm_navigation li { position: relative; }
  #cm_navigation > ul > li { display: block; width: 100%; }
  #cm_navigation > ul > li > a { padding: 12px 58px 12px 16px; white-space: normal; }
  #cm_navigation > ul > li > ul,
  #cm_navigation > ul > li > ul > li > ul {
    position: static;
    display: none;
    visibility: hidden;
    opacity: 0;
    width: 100%;
  }
  #cm_navigation > ul > li:hover > ul,
  #cm_navigation > ul > li > ul > li:hover > ul {
    display: none;
    visibility: hidden;
    opacity: 0;
  }
  #cm_navigation > ul > li.mobile-submenu-open > ul,
  #cm_navigation > ul > li > ul > li.mobile-submenu-open > ul {
    display: block;
    visibility: visible;
    opacity: 1;
  }
  .mobile-submenu-toggle {
    position: absolute;
    top: 0;
    right: 0;
    width: 52px;
    height: 48px;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: 18px;
  }
  .mobile-submenu-toggle[aria-expanded="true"] { transform: rotate(180deg); }
  #cm_navigation > ul > li > ul > li,
  #cm_navigation > ul > li > ul > li > ul > li { display: block; width: 100%; }
  #cm_navigation > ul > li > ul > li > a,
  #cm_navigation > ul > li > ul > li > ul > li > a { padding: 10px 16px 10px 30px; white-space: normal; }

  #content { display: block; width: 100%; }
  #content tbody, #content tr, #content_main_wrapper, #content_right_wrapper { display: block; width: 100%; max-width: none; }
  .content_main { padding: 18px 16px 24px; max-width: none; }
  .content_sidebar { padding: 0 16px 20px; }
  #widgetbar_page_1, #widgetbar_page_2, #widgetbar_site_1, #widgetbar_site_2 { width: 100%; }

  .content_main img,
  .content_main iframe,
  .content_main video { max-width: 100%; height: auto; }
  /* Wide article tables scroll inside their own area instead of widening the page. */
  .mobile-table-scroll {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }
  .mobile-table-scroll table {
    width: 820px !important;
    min-width: 820px;
    max-width: none;
    table-layout: fixed !important;
  }
  .mobile-table-scroll th,
  .mobile-table-scroll td {
    min-width: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
  }
  .mobile-table-scroll th:nth-child(1), .mobile-table-scroll td:nth-child(1) { width: 105px !important; }
  .mobile-table-scroll th:nth-child(2), .mobile-table-scroll td:nth-child(2) { width: 180px !important; }
  .mobile-table-scroll th:nth-child(3), .mobile-table-scroll td:nth-child(3) { width: 220px !important; }
  .mobile-table-scroll th:nth-child(4), .mobile-table-scroll td:nth-child(4) { width: 115px !important; }
  .mobile-table-scroll th:nth-child(5), .mobile-table-scroll td:nth-child(5) { width: 100px !important; }
  .mobile-table-scroll th:nth-child(6), .mobile-table-scroll td:nth-child(6) { width: 100px !important; }
  .content_main input, .content_main select, .content_main textarea, .content_main button { max-width: 100%; }
  h1 { font-size: 1.5rem; }
  h2 { font-size: 1.2rem; }
  #footer { width: 100%; max-width: 100%; padding: 14px 16px; overflow-wrap: anywhere; }
  #footer iframe { max-width: 100%; height: auto; }
}