/* dabro-menu — общесайтовая шапка с выпадашками + левый drawer-каталог.
   Структура: док Максима 13.07.2026. Namespace dbm- (не конфликтует со стилями страниц).
   Мотание: только transform/opacity, токены, reduced-motion. */

:root{
  --dbm-dur-fast:150ms;
  --dbm-dur-base:200ms;
  --dbm-dur-slow:300ms;
  --dbm-ease-out:cubic-bezier(0,0,.2,1);
  --dbm-ease-in:cubic-bezier(.4,0,1,1);
  --dbm-bg:rgba(30,30,33,.94);
  --dbm-panel:#1c1c1f;
  --dbm-line:#333;
  --dbm-txt:#e8eaf0;
  --dbm-mut:#c2c7d2;
  --dbm-dim:#8b93a4;
  --dbm-neon:#06f806;
  --dbm-violet:#bb06f8;
}

/* ── Шапка ─────────────────────────────────────────────────────────────── */
.dbm-hd{position:sticky;top:0;z-index:100;background:var(--dbm-bg);backdrop-filter:blur(10px);border-bottom:1px solid var(--dbm-line);font-family:inherit}
.dbm-hd__in{max-width:1200px;margin:0 auto;padding:0 20px;height:66px;display:flex;align-items:center;gap:20px}
.dbm-hd__logo img{height:38px;width:auto;display:block}
.dbm-hd__right{margin-left:auto;display:flex;align-items:center;gap:16px}
.dbm-hd__phone{color:var(--dbm-txt);text-decoration:none;font-weight:700;font-size:15px;white-space:nowrap;transition:color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-hd__cta{border:1.5px solid var(--dbm-neon);color:var(--dbm-neon);text-decoration:none;font-weight:700;font-size:14px;padding:9px 20px;border-radius:100px;white-space:nowrap;transition:background-color var(--dbm-dur-fast) var(--dbm-ease-out),border-color var(--dbm-dur-fast) var(--dbm-ease-out),color var(--dbm-dur-fast) var(--dbm-ease-out),transform var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-hd__cta:active{transform:translateY(1px) scale(.98)}
@media (hover:hover) and (pointer:fine){
  .dbm-hd__phone:hover{color:var(--dbm-neon)}
  .dbm-hd__cta:hover{background:var(--dbm-violet);border-color:var(--dbm-violet);color:#fff}
}

/* ── Верхняя навигация с выпадашками ───────────────────────────────────── */
.dbm-nav__list{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.dbm-item{position:relative}
.dbm-item__btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;font:inherit;font-weight:600;font-size:15px;color:var(--dbm-mut);padding:10px 11px;border-radius:9px;white-space:nowrap;transition:color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-item__chev{transition:transform var(--dbm-dur-base) var(--dbm-ease-out);flex:none}
.dbm-item.open .dbm-item__btn{color:var(--dbm-neon)}
.dbm-item.open .dbm-item__chev{transform:rotate(180deg)}
@media (hover:hover) and (pointer:fine){ .dbm-item__btn:hover{color:var(--dbm-neon)} }

.dbm-dd{position:absolute;top:calc(100% + 8px);left:0;min-width:270px;background:var(--dbm-panel);border:1px solid var(--dbm-line);border-radius:14px;padding:10px;display:flex;flex-direction:column;box-shadow:0 18px 40px -12px rgba(0,0,0,.55);
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity var(--dbm-dur-base) var(--dbm-ease-out),transform var(--dbm-dur-base) var(--dbm-ease-out),visibility 0s linear var(--dbm-dur-base)}
.dbm-item.open .dbm-dd{opacity:1;visibility:visible;transform:translateY(0);transition:opacity var(--dbm-dur-base) var(--dbm-ease-out),transform var(--dbm-dur-base) var(--dbm-ease-out),visibility 0s}
.dbm-dd__link{display:block;color:var(--dbm-mut);text-decoration:none;font-size:14.5px;font-weight:600;padding:9px 12px;border-radius:9px;transition:color var(--dbm-dur-fast) var(--dbm-ease-out),background-color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-dd__link--sub{padding-left:24px;font-weight:500}
.dbm-dd__grouplabel{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--dbm-dim);padding:12px 12px 4px}
@media (hover:hover) and (pointer:fine){ .dbm-dd__link:hover{color:var(--dbm-neon);background:rgba(255,255,255,.04)} }

/* ── Бургер (2 линии → X) ──────────────────────────────────────────────── */
.dbm-burger{width:40px;height:40px;flex:none;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:none;border:1px solid var(--dbm-line);border-radius:10px;cursor:pointer;transition:border-color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-burger span{display:block;width:18px;height:2px;background:var(--dbm-txt);border-radius:2px;transition:transform var(--dbm-dur-base) var(--dbm-ease-out)}
.dbm-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
.dbm-burger[aria-expanded="true"] span:nth-child(2){transform:translateY(-4.5px) rotate(-45deg)}
@media (hover:hover) and (pointer:fine){ .dbm-burger:hover{border-color:var(--dbm-neon)} }

/* ── Левый drawer-каталог ──────────────────────────────────────────────── */
.dbm-overlay{position:fixed;inset:0;z-index:998;background:rgba(10,10,12,.55);opacity:0;transition:opacity 250ms var(--dbm-ease-out)}
.dbm-overlay.on{opacity:1}
.dbm-dr{position:fixed;top:0;left:0;bottom:0;z-index:999;width:min(380px,90vw);background:var(--dbm-panel);border-right:1px solid var(--dbm-line);display:flex;flex-direction:column;font-family:inherit;color:var(--dbm-txt);
  transform:translateX(-102%);visibility:hidden;
  transition:transform var(--dbm-dur-slow) var(--dbm-ease-out),visibility 0s linear var(--dbm-dur-slow)}
.dbm-dr.open{transform:translateX(0);visibility:visible;transition:transform var(--dbm-dur-slow) var(--dbm-ease-out),visibility 0s}
.dbm-dr.closing{transform:translateX(-102%);transition:transform var(--dbm-dur-base) var(--dbm-ease-in),visibility 0s linear var(--dbm-dur-base)}
.dbm-dr__head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--dbm-line);flex:none}
.dbm-dr__title{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dbm-dim)}
.dbm-dr__close{background:none;border:0;color:var(--dbm-mut);font-size:16px;cursor:pointer;padding:6px 10px;border-radius:8px;transition:color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-dr__body{overflow-y:auto;padding:8px 20px 20px;flex:1;overscroll-behavior:contain}
.dbm-dr__sec{padding:14px 0;border-bottom:1px solid #2a2a2e}
.dbm-dr__sec:last-child{border-bottom:0}
.dbm-dr__label{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dbm-dim);margin:0 0 8px}
.dbm-dr__sublabel{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--dbm-dim);margin:12px 0 4px}
.dbm-dr__link{display:block;color:var(--dbm-mut);text-decoration:none;font-size:15px;font-weight:600;padding:8px 0;transition:color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-dr__acc{margin:2px 0}
.dbm-dr__acc summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;color:var(--dbm-mut);font-size:15px;font-weight:600;padding:8px 0;transition:color var(--dbm-dur-fast) var(--dbm-ease-out)}
.dbm-dr__acc summary::-webkit-details-marker{display:none}
.dbm-dr__acc summary::before{content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);transition:transform var(--dbm-dur-base) var(--dbm-ease-out);flex:none}
.dbm-dr__acc[open] summary::before{transform:rotate(45deg)}
.dbm-dr__acc .dbm-dr__link{padding-left:18px;font-weight:500;font-size:14px;color:var(--dbm-dim)}
.dbm-dr__foot{flex:none;padding:14px 20px;border-top:1px solid var(--dbm-line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.dbm-dr__phone{color:var(--dbm-txt);text-decoration:none;font-weight:700;font-size:15px}
.dbm-dr__cta{border:1.5px solid var(--dbm-neon);color:var(--dbm-neon);text-decoration:none;font-weight:700;font-size:13px;padding:8px 16px;border-radius:100px;white-space:nowrap;transition:background-color var(--dbm-dur-fast) var(--dbm-ease-out),border-color var(--dbm-dur-fast) var(--dbm-ease-out),color var(--dbm-dur-fast) var(--dbm-ease-out)}
@media (hover:hover) and (pointer:fine){
  .dbm-dr__close:hover,.dbm-dr__link:hover,.dbm-dr__acc summary:hover{color:var(--dbm-neon)}
  .dbm-dr__cta:hover{background:var(--dbm-violet);border-color:var(--dbm-violet);color:#fff}
}
body.dbm-lock{overflow:hidden}

/* ── Фокус и клавиатура ────────────────────────────────────────────────── */
.dbm-item__btn:focus-visible,.dbm-dd__link:focus-visible,.dbm-burger:focus-visible,
.dbm-dr__link:focus-visible,.dbm-dr__close:focus-visible,.dbm-dr__acc summary:focus-visible,
.dbm-hd__cta:focus-visible,.dbm-dr__cta:focus-visible{outline:2px solid var(--dbm-neon);outline-offset:2px;border-radius:8px}

/* ── Адаптив ───────────────────────────────────────────────────────────── */
@media (max-width:1100px){
  .dbm-nav{display:none}
  .dbm-hd__in{gap:14px}
}
@media (max-width:640px){
  .dbm-hd__phone{display:none}
  .dbm-hd__cta{font-size:13px;padding:8px 14px}
}

/* ── Reduced motion ────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  .dbm-hd *,.dbm-dr,.dbm-dr *,.dbm-overlay{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}