/* ════════════════════════════════════════════════════════════
   OfferMenu — style rozwijalnego menu "Oferta"
   ════════════════════════════════════════════════════════════ */
.om-wrap { position: relative; display: inline-flex; }

.om-trigger {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.om-trigger.open {
  background: var(--leaf-soft);
  color: var(--ink);
}
.om-chev {
  display: inline-flex;
  color: currentColor;
  transition: transform .18s ease;
  margin-left: 2px;
  opacity: 0.7;
}
.om-trigger.open .om-chev { transform: rotate(180deg); opacity: 1; }

.om-popover {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: 620px;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 28px 60px rgba(31,61,43,0.18), 0 4px 14px rgba(31,61,43,0.06);
  padding: 22px;
  z-index: 80;
  display: flex;
  flex-direction: column;
  gap: 16px;
  animation: om-pop-in 160ms cubic-bezier(.2,.7,.3,1);
  transform-origin: top center;
}
@keyframes om-pop-in {
  from { opacity: 0; transform: translate(-50%, -6px) scale(0.98); }
  to   { opacity: 1; transform: translate(-50%, 0) scale(1); }
}

.om-group { display: flex; flex-direction: column; gap: 6px; }
.om-group + .om-group {
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.om-group-head {
  padding: 0 8px 4px;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.om-group-title {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.om-group-sub {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--apricot);
}
.om-group-items { display: flex; flex-direction: column; gap: 2px; }

.om-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border-radius: 12px;
  background: transparent;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  color: var(--ink);
  transition: background .12s;
}
.om-item:hover { background: var(--bg-soft); }
.om-item:focus-visible { outline: 2px solid var(--sage); outline-offset: 2px; }

.om-item-n {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.12em;
  color: var(--ink-muted);
  flex: 0 0 28px;
  padding-top: 3px;
}
.om-item-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.om-item-title {
  font-family: var(--serif);
  font-size: 22px;
  letter-spacing: -0.005em;
  line-height: 1.15;
  color: var(--ink);
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.om-item-tag {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--ink-muted);
  text-transform: uppercase;
}
.om-item-soon {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: var(--apricot-soft);
  color: #8B3F1A;
  padding: 2px 7px;
  border-radius: 999px;
}
.om-item-arrow {
  color: var(--ink-muted);
  opacity: 0.6;
  flex: 0 0 auto;
  transition: transform .15s, opacity .15s, color .15s;
}
.om-item:hover .om-item-arrow {
  color: var(--ink);
  opacity: 1;
  transform: translateX(2px);
}

/* Pro items accent (gold) */
.om-item.om-item-pro:hover { background: rgba(201,169,97,0.08); }
.om-item-pro .om-item-n { color: var(--pro-accent); }
.om-item-pro .om-item-tag { color: var(--pro-accent); }

/* Mobile */
@media (max-width: 720px) {
  .om-popover {
    width: min(380px, calc(100vw - 24px));
    left: auto;
    right: 0;
    transform: none;
  }
  @keyframes om-pop-in {
    from { opacity: 0; transform: translateY(-6px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
  }
}
