:root {
    --primary-color: #6a0dad; /* Purple, color: #6a0dad */
    --accent-color: #ffd700;  /* Gold,   color: #ffd700 */
    --accent-dark: #daa520;   /* Darker gold, color: #daa520 */
  }

  /* Fixed-position window that can be centered, dragged, resized */
  .mega-menu-window {
    display: none;
    position: fixed;
    z-index: 12000; /* was 1000 — ensure above sticky header layers */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    border: 2px solid var(--accent-color); /* #ffd700 */
    opacity: 0;
    transform: translateY(20px);            /* entry animation only */
    transition: opacity 0.3s ease, transform 0.3s ease;
    /* Keep menus usable and on-screen */
    max-width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
    overflow: auto;
    will-change: top, left, width, height, opacity, transform;
    background: #fff; /* explicit so transparent pages don’t “show through” */
  }
  .mega-menu-window.active {
    display: block;
    opacity: 1;
    transform: translateY(0);
  }

  /* Used briefly while clamping to avoid transition jank */
  .mega-menu-window.__clamp {
    transition: none !important;
  }

  /* Drag + resize affordances (unchanged layout-wise) */
  .resize-handle { position: absolute; width: 12px; height: 12px; background: transparent; z-index: 12001; }
  .resize-nw { top: -6px; left: -6px; cursor: nwse-resize; } .resize-ne { top: -6px; right: -6px; cursor: nesw-resize; }
  .resize-sw { bottom: -6px; left: -6px; cursor: nesw-resize; } .resize-se { bottom: -6px; right: -6px; cursor: nwse-resize; }
  .resize-n  { top: -6px; left: 50%; transform: translateX(-50%); cursor: ns-resize; }
  .resize-s  { bottom: -6px; left: 50%; transform: translateX(-50%); cursor: ns-resize; }
  .resize-w  { top: 50%; left: -6px; transform: translateY(-50%); cursor: ew-resize; }
  .resize-e  { top: 50%; right: -6px; transform: translateY(-50%); cursor: ew-resize; }
  .drag-handle { cursor: move; user-select: none; }

  #reset-layout-button {
    position: fixed; bottom: 20px; right: 20px; z-index: 12002;
    background-color: var(--accent-color); /* #ffd700 */
    color: var(--primary-color);           /* #6a0dad */
    font-family: 'Poppins', sans-serif; font-weight: 600; border: none;
    padding: 10px 20px; border-radius: 5px; cursor: pointer;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2); transition: background-color 0.3s;
  }
  #reset-layout-button:hover { background-color: var(--accent-dark); /* #daa520 */ }

  /* Mobile: force a sane viewport-fit dialog (no drag/resize handles) */
  @media (max-width: 991px) { #reset-layout-button { display: none; } }
  @media (max-width: 768px) {
    .mega-menu-window {
      width: 95vw !important;
      left: 2.5vw !important;
      top: 80px !important;
      transform: none !important;
      max-height: calc(100vh - 100px);
    }
    .resize-handle { display: none; }
  }

.mega-menu-window { box-sizing: border-box; }
  #mega-menu-about, #mega-menu-careers, #mega-menu-gallery { max-width: calc(100vw - 20px); }