/*mobile menu spans the full screen width*/
.t450__menu_show {
    max-width: 100% !important;
}

/* ============================================================================
   THE BASE — BRAND POLISH PATCH v1.0
   ============================================================================ */

/* ────────────────────────────────────────────────────────────────────────── */
/* 1. COOKIE BANNER REDESIGN (Tilda Default Override)                        */
/* ────────────────────────────────────────────────────────────────────────── */

.tilda-cookie-banner,
[class*="cookie"],
[class*="consent"],
.modal-backdrop,
.tn-cookie-banner {
  background: #ffffff !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 0px !important;
  padding: 24px 32px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", sans-serif !important;
  position: fixed !important;
  bottom: 32px !important;
  right: 32px !important;
  max-width: 360px !important;
  z-index: 9998 !important;
}

.tilda-cookie-banner p,
[class*="cookie"] p,
[class*="consent"] p,
[class*="cookie"] span,
[class*="consent"] span {
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: #666 !important;
  margin: 0 0 16px 0 !important;
  font-weight: 400 !important;
}

button[class*="cookie"],
button[class*="accept"],
button[class*="consent"],
.tilda-cookie-banner button,
[class*="cookie"] button,
[class*="consent"] button,
.modal-footer button,
[data-cookie-accept],
[data-cookies-accept] {
  background: #C0392B !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0px !important;
  padding: 12px 28px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  box-shadow: none !important;
  outline: none !important;
}

button[class*="cookie"]:hover,
button[class*="accept"]:hover,
button[class*="consent"]:hover,
.tilda-cookie-banner button:hover,
[class*="cookie"] button:hover,
[class*="consent"] button:hover,
[data-cookie-accept]:hover,
[data-cookies-accept]:hover {
  background: #a03225 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(192, 57, 43, 0.25) !important;
}

button[class*="cookie"]:active,
button[class*="accept"]:active,
button[class*="consent"]:active,
.tilda-cookie-banner button:active,
[class*="cookie"] button:active,
[class*="consent"] button:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 6px rgba(192, 57, 43, 0.15) !important;
}

button[class*="reject"],
button[class*="decline"],
[class*="cookie"] button:last-child,
[class*="consent"] button:last-child {
  background: #f5f5f5 !important;
  color: #333 !important;
  border: 1px solid #ddd !important;
  margin-left: 12px !important;
}

button[class*="reject"]:hover,
button[class*="decline"]:hover {
  background: #e8e8e8 !important;
  border-color: #bbb !important;
}

.tilda-cookie-banner [class*="close"],
[class*="cookie"] [class*="close"],
[class*="consent"] [class*="close"],
button.close {
  background: transparent !important;
  border: none !important;
  color: #999 !important;
  font-size: 20px !important;
  cursor: pointer !important;
  padding: 4px !important;
  transition: color 0.2s ease !important;
}

.tilda-cookie-banner [class*="close"]:hover,
[class*="cookie"] [class*="close"]:hover {
  color: #333 !important;
}

.modal-backdrop,
.tilda-cookie-overlay,
[class*="cookie-overlay"] {
  background: transparent !important;
  display: none !important;
}

/* ────────────────────────────────────────────────────────────────────────── */
/* 2. СКРЫТИЕ ОТЛАДОЧНОГО ТЕКСТА                                            */
/* ────────────────────────────────────────────────────────────────────────── */

[data-debug],
[class*="debug"],
[class*="test"],
[class*="testing"],
.console-output,
.debug-info,
.test-info,
#debug,
#testing {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

.tb-debug-container,
.debug-container,
.test-results,
.qa-info,
[class*="qa-"],
[class*="dev-"],
[class*="staging-"] {
  display: none !important;
}

/* ────────────────────────────────────────────────────────────────────────── */
/* 3. PRINT MEDIA — Скрытие посторонних элементов при печати                */
/* ────────────────────────────────────────────────────────────────────────── */

@media print {
  .tilda-cookie-banner,
  [class*="cookie"],
  [class*="consent"],
  .modal-backdrop,
  .tn-cookie-banner {
    display: none !important;
  }

  [data-calc-generate],
  [data-calc-reset],
  [data-calc-print],
  .tb-menu-controls button,
  button[class*="control"],
  button[class*="action"],
  button:not(.tb-menu-item button) {
    display: none !important;
  }

  [class*="widget"],
  [class*="floating"],
  [class*="chat"],
  [id*="widget"],
  [class*="whatsapp"],
  [class*="telegram"],
  .widget-float,
  .floating-widget,
  .chat-widget,
  .help-widget {
    display: none !important;
  }

  [class*="social"],
  [class*="share"],
  .social-buttons,
  .share-buttons,
  [id*="social"],
  [id*="share"] {
    display: none !important;
  }

  nav,
  header,
  footer,
  [role="navigation"],
  [class*="navbar"],
  [class*="header"],
  [class*="footer"],
  .tn-nav,
  .tn-header {
    display: none !important;
  }

  body {
    background: white !important;
  }

  * {
    background-image: none !important;
    box-shadow: none !important;
  }

  [data-menu-template],
  [data-menu-template].tb-menu-visible,
  .tb-menu-document,
  .tb-calculator-container,
  #rec2429369331 {
    display: block !important;
    background: white !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .tb-menu-item {
    page-break-inside: avoid !important;
  }

  .tb-menu-grid {
    page-break-inside: avoid !important;
  }

  .tb-menu-logo-section {
    page-break-after: avoid !important;
  }

  .tb-menu-document {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  p {
    orphans: 3 !important;
    widows: 3 !important;
  }
}

/* ────────────────────────────────────────────────────────────────────────── */
/* 4. ОБЩИЕ УЛУЧШЕНИЯ UI/UX                                                 */
/* ────────────────────────────────────────────────────────────────────────── */

#rec2429369331,
.tb-calculator-container,
.tb-menubuilder-container {
  background: linear-gradient(135deg, #fafafa 0%, #f5f5f5 100%);
  border-radius: 0px;
}

button,
input,
select,
textarea,
a {
  transition: all 0.2s ease;
}

button:focus,
input:focus,
select:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.15);
}

a {
  color: #C0392B;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

#rec2430603261 {
  transform: none !important;
  margin-top: 0 !important;
  position: relative !important;
  top: 0 !important;
  z-index: 5 !important;
}

/* ────────────────────────────────────────────────────────────────────────── */
/* 5. ТЁМНЫЙ РЕЖИМ (опционально)                                             */
/* ────────────────────────────────────────────────────────────────────────── */

@media (prefers-color-scheme: dark) {
  #rec2429369331,
  .tb-calculator-container {
    background: linear-gradient(135deg, #1a1a1a 0%, #222 100%);
    color: #e0e0e0;
  }

  .tilda-cookie-banner {
    background: #252525 !important;
    color: #e0e0e0 !important;
    border-color: #333 !important;
  }

  .tilda-cookie-banner p,
  [class*="cookie"] p {
    color: #999 !important;
  }
}

/* ===================================================================== */
/* THE BASE: DARK MODE (site-wide, invert-based)                          */
/* ===================================================================== */
html.tb-dark-mode{
  filter: invert(1) hue-rotate(180deg);
  background:#fff;
}
html.tb-dark-mode img,
html.tb-dark-mode video,
html.tb-dark-mode picture,
html.tb-dark-mode svg,
html.tb-dark-mode iframe,
html.tb-dark-mode .t-bgimg,
html.tb-dark-mode [style*="background-image"]{
  filter: invert(1) hue-rotate(180deg);
}
html.tb-dark-mode #tb-dark-btn,
html.tb-dark-mode #tb-dark-panel{
  filter: invert(1) hue-rotate(180deg);
}
html.tb-dark-mode{
  transition: filter .2s ease;
}

/* THE BASE: consistent focus outline color across the site */
/* Prevents the browser/OS default focus ring (which can render as a pink/rose glow depending on the visitor's system accent color) from clashing with the black/white/red brand palette on custom buttons and controls. */
button:focus-visible, a:focus-visible, [tabindex]:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline-color: #000 !important;
}


/* ============================================================
   THE BASE  |  DARK GLASS HEADER + MEGA MENU OVERRIDE
   Added via Site Settings > Code > Custom CSS.
   Placed here rather than in a T123 block on the header page:
   Tilda does not inject extra blocks added to the header page
   into published pages (verified: block rec2503778061 saved and
   published, never reached the live HTML even after Publish All).
   Custom CSS is site-wide and needs no block injection.
   ============================================================ */
/* ==== 1. HEADER BAR: DARK GLASS ==== */
#rec1842546651 .t396__artboard{
  background:rgba(0,0,0,.9) !important;
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  backdrop-filter:blur(20px) saturate(140%);
  border-bottom:1px solid rgba(255,255,255,.07);
  z-index:995 !important;
}
/* Zero Block sometimes paints its background on a separate layer */
#rec1842546651 .t396__filter{background:transparent !important;}

/* ==== 2. NAV ==== */
.tbne-link{
  color:#FFFFFF !important;
  min-height:44px;              /* 44x44 touch target */
  display:inline-flex;
  align-items:center;
  transition:color .2s ease, opacity .2s ease;
}
.tbne-link:hover{color:#C9C9C9 !important;}
.tbne-chev{
  stroke:#FFFFFF !important;
  color:#FFFFFF !important;
  opacity:.75;
  transition:transform .25s ease, opacity .2s ease;
}
.tbne-item:hover .tbne-chev{opacity:1;}

/* ==== 3. PHONE AND ICONS ==== */
#rec1842546651 a[href^="tel:"],
#rec1842546651 a[href^="tel:"] .tn-atom{color:#FFFFFF !important;}
/* WhatsApp icon ships as a colored PNG; only a filter can recolor it */
#rec1842546651 a[href*="wa.me"] img{
  filter:brightness(0) invert(1);
  opacity:.85;
  transition:opacity .2s ease;
}
#rec1842546651 a[href*="wa.me"]:hover img{opacity:1;}

/* ==== 4. MEGA MENU PANEL ==== */
/* TRANSPARENCY NOTE. The brief asked for bg-white/[0.02] + backdrop-blur.
   On the live page that made the ticker and the hero headline read straight
   through the panel: backdrop-filter is disabled when the element or any
   ancestor has a transform, and the scaleY open animation sat on the parent
   .tbne-wrap. Fix: the animation moved onto .tbne-panel itself and opacity
   raised to .97. Blur stays as progressive enhancement; the glass effect now
   comes from the 1px light border, which is the only readable option on top
   of an animated canvas. */
.tbne-panel{
  background:rgba(5,5,5,.97) !important;
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  backdrop-filter:blur(18px) saturate(130%);
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:16px !important;
  box-shadow:0 24px 60px -18px rgba(0,0,0,.85) !important;
  color:#FFFFFF !important;
  transform-origin:top center;
  transform:scaleY(.96) translateY(-6px);
  opacity:0;
  transition:transform .22s cubic-bezier(.2,.7,.3,1), opacity .18s ease;
}
.tbne-item:hover .tbne-panel,
.tbne-item:focus-within .tbne-panel{
  transform:scaleY(1) translateY(0);
  opacity:1;
}
/* Parent must not be transformed, it would kill backdrop-filter */
.tbne-wrap{
  transform:none !important;
  transition:opacity .18s ease !important;
}

/* ==== 5. COLUMN HEADINGS ==== */
.tbne-col-title{
  color:#8E8E8E !important;
  font-size:10px !important;
  font-weight:600 !important;
  letter-spacing:.15em !important;
  text-transform:uppercase !important;
}

/* ==== 6. MENU LINKS ==== */
.tbne-links a{
  color:#FFFFFF !important;
  font-weight:400 !important;
  min-height:44px;
  display:flex;
  align-items:center;
  border-radius:8px !important;
  transition:color .18s ease, background .18s ease;
}
.tbne-links a:hover{
  color:#FF0000 !important;
  background:rgba(255,255,255,.04) !important;
}

/* ==== 7. TECH BADGES ==== */
/* For a monochrome variant swap rgba(255,0,0,.32) and #FF5A5A
   for rgba(255,255,255,.22) and #B8B8B8 */
.tbne-badge,
.tbne-badge-green,
.tbne-badge-blue,
.tbne-badge-purple,
.tbne-badge-amber{
  background:transparent !important;
  color:#FF5A5A !important;
  border:1px solid rgba(255,0,0,.32) !important;
  border-radius:3px !important;
  font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace !important;
  font-size:9px !important;
  font-weight:500 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
  padding:2px 5px !important;
  line-height:1.2 !important;
}

/* ==== 8. PANEL FOOTER ==== */
.tbne-panel-footer{
  border-top:1px solid rgba(255,255,255,.08) !important;
  color:#8E8E8E !important;
}
.tbne-panel-footer a:not(.tbne-cta-primary){
  color:#8E8E8E !important;
  transition:color .2s ease;
}
.tbne-panel-footer a:not(.tbne-cta-primary):hover{color:#FFFFFF !important;}
.tbne-footer-icon{
  stroke:#8E8E8E !important;
  color:#8E8E8E !important;
}
/* CTA: outline glass button, red only on hover */
.tbne-cta-primary{
  background:rgba(255,255,255,.05) !important;
  color:#FFFFFF !important;
  border:1px solid rgba(255,255,255,.2) !important;
  border-radius:8px !important;
  min-height:44px;
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease !important;
}
.tbne-cta-primary:hover{
  background:rgba(255,0,0,.08) !important;
  border-color:#FF0000 !important;
  box-shadow:0 0 22px rgba(255,0,0,.18) !important;
  color:#FFFFFF !important;
}
.tbne-cta-primary svg{stroke:currentColor !important;}

/* ==== 9. RESOURCES DROPDOWN (block rec2483211811) ==== */
#tb-res-dd{
  background:rgba(8,8,8,.9) !important;
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:12px !important;
  box-shadow:0 20px 48px -16px rgba(0,0,0,.85) !important;
}
#tb-res-dd a{
  color:#FFFFFF !important;
  min-height:44px;
  display:flex !important;
  align-items:center;
  transition:color .18s ease, background .18s ease;
}
#tb-res-dd a:hover{
  color:#FF0000 !important;
  background:rgba(255,255,255,.04) !important;
}

/* ==== 10. THEME TOGGLE AND ITS PANEL ==== */
/* Do NOT touch the button background or border: it has its own light and
   dark theme logic, and any override turned it into a light circle on the
   dark bar. Only the touch target size is set here. */
#tb-dark-btn{
  min-width:44px;
  min-height:44px;
}
#tb-dark-panel{
  background:rgba(8,8,8,.92) !important;
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:14px !important;
  color:#FFFFFF !important;
}
#tb-dark-info,#tb-dark-panel-label{color:#8E8E8E !important;}

/* ==== 11. ACCESSIBILITY ==== */
#rec1842546651 a:focus-visible,
#rec1842546651 button:focus-visible,
.tbne-links a:focus-visible,
.tbne-cta-primary:focus-visible,
#tb-res-dd a:focus-visible{
  outline:2px solid #FFFFFF;
  outline-offset:2px;
  border-radius:6px;
}

/* ==== 12. RESPONSIVE ==== */
@media(max-width:1200px){
  .tbne-panel{max-width:calc(100vw - 32px);}
}
@media(prefers-reduced-motion:reduce){
  .tbne-wrap{transition:opacity .01s !important;transform:none !important;}
  .tbne-item:hover .tbne-wrap,
  .tbne-item:focus-within .tbne-wrap{transform:none !important;}
  .tbne-link,.tbne-links a,.tbne-cta-primary{transition:none !important;}
}