/* Portfolio dropdown (desktop) and portfolio accordion (mobile menu).
   Shared by index.html and the generated listing/portfolio pages. The markup
   is generated from data/listings.mjs by scripts/build.mjs. */

.eg-dd { position: relative; display: flex; align-items: center; }
.eg-dd-trigger { display: inline-flex; align-items: center; gap: 8px; }
.eg-dd:hover .eg-dd-trigger,
.eg-dd:focus-within .eg-dd-trigger { color: #D4AF37 !important; }
.eg-dd-caret {
  display: block; width: 6px; height: 6px; margin-top: -3px;
  border-right: 1px solid currentColor; border-bottom: 1px solid currentColor;
  transform: rotate(45deg); transition: transform .3s ease, margin .3s ease;
}
.eg-dd:hover .eg-dd-caret,
.eg-dd:focus-within .eg-dd-caret { transform: rotate(-135deg); margin-top: 3px; }

/* padding-top is the hover bridge between the trigger and the panel */
.eg-dd-panel {
  position: absolute; top: 100%; left: 50%; z-index: 120;
  width: min(780px, 92vw); padding-top: 22px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translate(-50%, 8px);
  transition: opacity .3s ease, transform .3s ease, visibility 0s linear .3s;
}
.eg-dd:hover .eg-dd-panel,
.eg-dd:focus-within .eg-dd-panel {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translate(-50%, 0);
  transition: opacity .3s ease, transform .3s ease, visibility 0s;
}
.eg-dd-box {
  background: rgba(13,27,42,0.97); border: 1px solid rgba(224,225,221,0.16);
  border-radius: 3px; box-shadow: 0 28px 60px rgba(5,12,20,0.45);
  backdrop-filter: saturate(150%) blur(18px); -webkit-backdrop-filter: saturate(150%) blur(18px);
}
.eg-dd-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(224,225,221,0.10); }
.eg-dd-col { background: #0D1B2A; padding: 26px 24px 22px; display: flex; flex-direction: column; gap: 4px; }
.eg-dd-market {
  display: flex; align-items: center; gap: 9px; margin-bottom: 10px;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--eg-gold, #B08D57) !important;
}
.eg-dd-market::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex: none; }
.eg-dd-market:hover { color: #D4AF37 !important; }
.eg-dd-item { display: block; padding: 9px 10px; margin: 0 -10px; border-radius: 2px; transition: background .25s ease; }
.eg-dd-item:hover, .eg-dd-item:focus-visible { background: rgba(248,246,240,0.06); }
.eg-dd-name {
  display: block; font-family: 'Cormorant Garamond', serif; font-size: 21px; font-weight: 400;
  line-height: 1.15; color: #F8F6F0; transition: color .25s ease;
}
.eg-dd-item:hover .eg-dd-name { color: #D4AF37; }
.eg-dd-meta {
  display: block; margin-top: 3px; font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-size: 10px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(248,246,240,0.5);
}
.eg-dd-foot {
  display: flex; justify-content: space-between; gap: 16px; padding: 16px 24px;
  border-top: 1px solid rgba(224,225,221,0.12);
}
.eg-dd-foot a {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(248,246,240,0.72) !important;
}
.eg-dd-foot a:hover { color: #D4AF37 !important; }

/* ── mobile menu: Portfolio accordion ── */
.eg-mm { color: #F8F6F0; }
.eg-mm > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  font-family: 'Cormorant Garamond', serif; font-size: 38px; font-weight: 300; color: #F8F6F0; padding: 8px 0;
}
.eg-mm > summary::-webkit-details-marker { display: none; }
.eg-mm > summary::after {
  content: ''; width: 11px; height: 11px; margin-right: 6px;
  border-right: 1px solid var(--eg-gold, #B08D57); border-bottom: 1px solid var(--eg-gold, #B08D57);
  transform: rotate(45deg); transition: transform .3s ease;
}
.eg-mm[open] > summary::after { transform: rotate(-135deg); }
.eg-mm-body { display: flex; flex-direction: column; gap: 22px; padding: 10px 0 18px 2px; border-left: 1px solid rgba(176,141,87,0.35); padding-left: 18px; margin: 4px 0 10px; }
.eg-mm-group { display: flex; flex-direction: column; gap: 2px; }
.eg-mm-market {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-size: 10.5px; font-weight: 600;
  letter-spacing: 0.24em; text-transform: uppercase; color: var(--eg-gold, #B08D57) !important; padding: 6px 0;
}
.eg-mm-item {
  font-family: 'Cormorant Garamond', serif; font-size: 24px; font-weight: 300; color: #F8F6F0 !important; padding: 5px 0;
}
.eg-mm-all {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-size: 10.5px; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase; color: rgba(248,246,240,0.72) !important;
}