/* ============================================================
   styles.css — общие стили сайта ВАУМОМЕНТ
   Тёплая светлая тема: розовый / зелёный акценты, жёлтый util-бар.
   Дизайн-токены собраны в :root как справочник. Инлайн-стили в
   разметке (в JS-модулях) используют те же hex-значения.
   ============================================================ */
:root {
  --pink: #FF2DB2;
  --green: #00AD56;
  --yellow: #FFE501;
  --ink: #0E0E10;
  --muted: #6B6B70;
  --faint: #9A9AA0;
  --line: #ECECEF;
  --bg-soft: #F6F6F8;
  --danger: #E11D48;
  --warn: #B58A00;
  --radius: 20px;
  --maxw: 1280px;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: #0E0E10;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

/* ---- warehouse ---- */
.bc { color: #9A9AA0; text-decoration: none; }
.bc:hover { color: #FF2DB2; }
.card { border: 1px solid #ECECEF; border-radius: 20px; background: #fff; }
.wtab { transition: background-color .15s ease, color .15s ease; }
.wrow { transition: background-color .12s ease; }
.wrow:hover { background: #FAFAFB; }
.qbtn { transition: background-color .12s ease, border-color .12s ease; }
.qbtn:hover { background: #F4F4F6; border-color: #DADADE; }
.qbtn:active { transform: scale(.94); }
.wsearch:focus { border-color: #D8D8D8 !important; }
.wexp { transition: transform .12s ease, background-color .12s ease; }
.wexp:hover { background: #F4F4F6; }
.wthumb { transition: transform .12s ease; }
.wthumb:hover { transform: scale(1.07); }

/* ---- header ---- */
.hd-util { color: #0E0E10; text-decoration: none; font-size: 13px; transition: opacity .15s ease; white-space: nowrap; opacity: .78; }
.hd-util:hover { opacity: 1; }
.hd-soc { transition: transform .15s ease; }
.hd-soc:hover { transform: translateY(-2px); }
.hd-cat-item { display: block; padding: 7px 10px; border-radius: 9px; color: #3A3A40; text-decoration: none; font-size: 14px; transition: background .12s ease, color .12s ease; }
.hd-cat-item:hover { background: #FFF0F8; color: #FF2DB2; }
.hd-cartbtn { transition: transform .12s ease; }
.hd-cartbtn:hover { transform: translateY(-1px); }

/* ---- footer ---- */
.ft-link { color: #52525B; text-decoration: none; transition: color .15s ease; }
.ft-link:hover { color: #FF2DB2; }
.ft-soc { transition: transform .15s ease, box-shadow .15s ease; }
.ft-soc:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.12); }

/* ---- floating widgets ---- */
@keyframes fwpulse { 0%,100% { box-shadow: 0 10px 30px rgba(0,173,86,.38), 0 0 0 0 rgba(0,173,86,.32); } 50% { box-shadow: 0 10px 30px rgba(0,173,86,.38), 0 0 0 12px rgba(0,173,86,0); } }
@keyframes fwslide { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes fwup { from { transform: translateY(16px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.fw-fab { transition: transform .15s ease; }
.fw-fab:hover { transform: scale(1.06); }
.fw-qbtn { cursor: pointer; width: 30px; height: 30px; border-radius: 9px; border: 1.5px solid #ECECEF; background: #fff; font-size: 17px; font-weight: 700; color: #0E0E10; display: flex; align-items: center; justify-content: center; line-height: 1; }
.fw-qbtn:hover { border-color: #FF2DB2; color: #FF2DB2; }
.fw-msg { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border-radius: 13px; border: 1px solid #ECECEF; text-decoration: none; color: #0E0E10; font-weight: 600; font-size: 14px; transition: background .12s ease; }
.fw-msg:hover { background: #F6F6F8; }

/* ---- stub / «в разработке» ---- */
.stub { max-width: 1280px; margin: 0 auto; padding: 0 32px 90px; }
.stub-card { border: 1px solid #ECECEF; border-radius: 24px; background: linear-gradient(180deg, #FFF 0%, #FBFBFD 100%); padding: 64px 40px; text-align: center; }
.stub-badge { display: inline-flex; align-items: center; gap: 8px; background: #FFF0F8; color: #FF2DB2; font-size: 12px; font-weight: 700; padding: 6px 12px; border-radius: 30px; margin-bottom: 18px; letter-spacing: .02em; }
.stub-title { font-size: 32px; font-weight: 800; letter-spacing: -.02em; margin: 0 0 10px; }
.stub-desc { font-size: 16px; color: #6B6B70; margin: 0 auto 26px; max-width: 520px; line-height: 1.6; }
.stub-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.stub-btn { display: inline-flex; align-items: center; height: 48px; padding: 0 22px; border-radius: 13px; font-weight: 700; font-size: 15px; text-decoration: none; cursor: pointer; }
.stub-btn.primary { background: #FF2DB2; color: #fff; }
.stub-btn.ghost { background: #fff; color: #3A3A40; border: 1.5px solid #ECECEF; }